Post on 23-Jan-2016
HyperText Markup Language (Lenguaje de Marcas de Hipertexto)
CaracteristicasUn lenguaje de marcado.Puede incluir un script (por ejemplo
Javascript).Es de MIME (text/html) (Extensiones de
Correo de Internet Multipropósito).Está definido en términos del SGML.
TagsEtiquetas (Tags).
Etiqueta de apertura y de cierre.Contenido. Atributos.Eventos.
Estructura General<!DOCTYPE><html>
<head></head><body>
<!-- vacio--></body>
</html>Ejemplo
<!DOCTYPE>. • declaración de tipo de documento (DTD)
– <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd">
– <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
– <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" http://www.w3.org/TR/html4/frameset.dtd”>
<head><meta>: no tiene cierre.
name: author, description, keywords, generator, revised, otro. http-equiv: Allow, Content-Encoding , Content-Length, Content-
Type (MIME), Date, Expires, Last-Modified, Location (URL) , Refresh, Set-Cookie, WWW-Authenticate.
Scheme: formato, URI. content: descripcion.
<title> Ejemplo
<base >: no tiene cierre. href: URL. target: _blank, _parent, _self, _top, nombre de marco(frame).
Ejemplo
<link >No tiene cierre
charset: UTF-8, ISO-8859-1(default). href. hreflang. media. rel: Alternat e, stylesheet, start, next, prev,
contents, index, glossary, copyright, chapter, section, subsection, appendix, help, bookmark, icon.
rev. target. type: MINE.
Atributos comuniestitle: información extra.lang.style.class.id.xml:lang.
Eventos comunes– Mouse:
• onclick• ondblclick• onmousedown• onmousemove• onmouseout• onmouseover• onmouseup
– Teclado:• onkeydown• onkeypress• onkeyup
<body>• <h1> a <h6>: Titulos.• <p>: Parrafo.• <pre>: Textual y por defecto.• <br />: salto de linea.• <hr />: linea horizontal.• <a>: enlaces o saltos.• <img /> : insertar imágenes.• <table>: tablas.• <form>: formularios.• <frame>: marcos.• <styte>: estilos.
Estilos de Texto• <em>: énfasis.• <strong>: fuerte.• <i>: cursiva.• <b>: negrita.• <big>:grande.• <small>:pequeña.• <sub>: sub-indice.• <sup>: indice superior.• <bdo>: direcion de texto (dir=“rtl” o dir=“ltr”).• <del>: eliminado (tachar)
» cite: URL» datetime: AAAA-MM-DDThh:mm:ssTZD
• <ins>:inserta (subrayar)
Presentaciones<dfn>: definicon de termino.<samp>: ejemplo computadora.<code>: tipo codigo.<kbd>: keyboard.<tt>: teletipo.<var>: variable.<cite>: cita.
Ejemplo de todo lo anterior
Bloques<acronym>: resaltar acronimo.<abbr>: abreviatura.<address>: direcion (fisica o digital).<blockquote>: cita larga<q>: cita corta.
<a> charset. href. hreflang. coords: (x1,y1,x2,y2),(x,y,radio), (x1,y1,x2,y2,…..). shape: rect, circle, poly, default. name. rel. rev. target. type: MINE.Ejemplo
<img />• alt: nombre alterno.• src: URL.• height: altura en pix o %.• width: ancho.• usemap: mapear. (#nombre).
• <map >: mapeo (name).– <area>
» alt.» coords.» href.» nohref: (nohref).» shape.» target.
Ejemplo
<table>• border: pixeles.• cellpadding: contenido.• cellspacing: entre celdas.• frame:void, above, below, hsides, vsides, lhs,
rhs, box, border (borde exterior).• rules:none, groups, rows, cols, all (borde
interior).• summary: resumen.• width: ancho en pixeles o %.
Dentro de <table>• <caption>: titulo (depues de <table>).• <tr>:
– align: right, left, center, justify, char.– char– charoff– valign: top, middle, bottom, baseline.
• <th>:– abbr– axis: categoria– colspan: n columnas– rowspan: n filas– scope: col, colgroup, row, rowgroup.– width– height
• <td>.• <col>.
– spam• <colgroup>• <thead>• <tbody>• <tfoot>
Ejemplo
<form>• action: URL.• accept: MIME (subida de archivo).• accept-charset.• enctype: application/x-www-form-urlencoded,
multipart/form-data, text/plain.• method: POST, GET.• name• target
<input>• accept• type: button, checkbox, file, hidden, image, password,
radio, reset, submit, text.• alt: solo para type=“image”.• src• checked: por defecto (checkbox, radio).• disabled• maxlength• name• readonly• size• value
Ejemplo