Guía de referencia de HTML Cómo usar esta guía - cuchuflo.com
Guía de referencia de HTML Cómo usar esta guía El nombre de las etiquetas HTML está escrito en negrita. Debajo de cada etiqueta se explican los posibles atributos que dicha etiqueta puede llevar. Si el valor de los atributos está escrito con letra normal, quiere decir que el atributo debe tomar exactamente ese valor; si por el contrario está escrito en cursiva, quiere decir que el valor que aparece debe sustituirse por un valor real (esto es, si pone núm, deberá escribirse un valor numérico; si pone color, deberá escribirse un valor para el color; si pone cad_caracteres, deberá escribirse un texto). El símbolo | significa “opción”. Esto quiere decir que el atributo debe tomar uno de los valores que aparezcan, no todos. Por ejemplo, si aparece top|bottom|middle, deberá escribirse un único valor: top, bottom o middle. Etiquetas básicas Declaración obligatoria documento HTML <!DOCTYPE HTML PUBLIC...> de tipo de <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" " http://www.w3.org/TR/html4/strict.dtd"> Declaración para un documento HTML estricto (utiliza hojas de estilo para el formato de la página) <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> Declaración para un documento HTML transicional (no utiliza hojas de estilo para el formato de la página) <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> Declaración para un documento HTML con marcos (es el mismo formato que el transicional pero con marcos) <html></html> <head></head> <title></title> Principio y fin del documento HTML <base> href=”URL” <meta> name="author|description|keywords|generator revised" content="cad_alfanumerica" http-equiv="content-type|refresh|expires” <body></body> background= "url" bgcolor="color" text="color" link="color" vlink="color" alink="color" <!-- comentario --> <script></script> src="URL" type=”tipo_de_contenido” <noscript></noscript> Cabecera Título Especifica el documento base sobre el que tomar las URLs relativas Nombre del documento base Información adicional Nombre de la propiedad Valor de la propiedad Se usa en lugar de name Cuerpo Imagen de fondo de la página Color de fondo Color de la fuente Color del enlace no visitado Color del enlace visitado Color del enlace seleccionado Texto que no aparecerá en la página Código de un programa Archivo externo donde se encuentra el código Tipo de contenido del script Contenido que se mostrará si el navegador no soporta scripts Formato de texto <b></b> <i></i> <u></u> <sub></sub> <sup></sup> <tt></tt> <pre></pre> width=# <font></font> size=”núm” size="+|-núm" color="color" face="cad_caracteres" <em></em> <strong></strong> <big></big> <small></small> <abbr></abbr> <acronym></acronym> <dfn></dfn> Negrita Cursiva Subrayado Subíndice Superíndice Estilo teletipo Preformateado Anchura del bloque Cambio de fuente Tamaño Tamaño relativo Color Tipo de fuente Énfasis Énfasis fuerte Grande Pequeña Abreviatura Acrónimo (siglas) Definición Estructura de contenidos <p></p> align=”left|center|right|justify” <br> <h1></h1> ... ... <h6></h6> <hr> align=”left|center|right|justify” size=”núm” width=”núm” |"núm%" noshade Párrafo Alineación Salto de línea Encabezados Separador horizontal Alineación Grosor Anchura Sin relieve Estilos <div> </div> <span> </span> <style type="text/css"></style> Contenedor genérico de idioma / estilo Contenedor genérico de idioma / estilo Declaración de estilos CSS Hipervínculos <a href="url"></a> Enlaces target="_blank | _self | _parent | _top | cad_caracteres" Marco de destino donde se abrirá el enlace onclick="cad_caracteres" Acción a realizar cuando se pulse el vínculo <a href="mailto:@"></a> Acción a realizar cuando se pase el ratón por encima Acción a realizar cuando el ratón abandone el vínculo Enlace con destino a un ancla dentro de una URL Enlace con destino a un ancla dentro de la misma página Enlace para enviar un correo <a href="mailto:@?subject=cad_caracteres"></a> Enlace para enviar un correo con asunto <a name="cad_caracteres"></a> Definición del ancla onmouseover="cad_caracteres" onmouseout="cad_caracteres" <a href="url#nombre_ancla"></a> <a href="#nombre_ancla"></a> Imágenes y multimedia <img src="url"> Insertar una imagen desde un archivo o URL align= top|bottom|middle|left|right Alineación alt="cad_caracteres" Texto alternativo si no aparece la imagen width=”núm|núm%” height=”núm|núm%” border=”núm” Anchura y altura de la imagen hspace=”núm” Espacio horizontal entre la imagen y el texto vspace=”núm” Espacio vertical entre la imagen y el texto Tamaño del borde en píxeles <object></object> <param> Objeto genérico (multimedia) Valor de propiedad con nombre Listas <ul></ul> type=”disc|circle|square” <ol></ol> type=”a|A|i|I|1” start=”núm” <li></li> <dl></dl> <dt></dt> <dd></dd> Lista desordenada Tipo de elemento de enumeración Lista ordenada Tipo de enumeración Posición de comienzo de enumeración Elemento de la lista Lista de definiciones Término Definición Tablas <table></table> align=”left|right|center” border=”núm” cellspacing=”núm” cellpadding=”núm” width=”núm” | “núm%” bgcolor="color" Declaración de tabla Alineación Borde Espacio entre celdas Espacio entre el borde de la celda y su contenido Anchura de la tabla Color de fondo frame=”void|above|below|hsides|lhs|rhs|vsides|box|border” Especifica qué bordes serán visibles rules=”none|groups|rows|cols|all” <tr></tr> align=”left|right|center|middle|bottom” bgcolor="color" <td></td> align=”left|right|center” valign=”top|middle|bottom” nowrap colspan=”núm” rowspan=”núm” height=”núm” | ”núm%” width=”núm” | ”núm%” bgcolor="color" <th></th> align=”left|right|center|middle|bottom” nowrap colspan=”núm” rowspan=”núm” height=”núm” | ”núm%” width=”núm” | ”núm%” bgcolor="color" <tbody></tbody> <tfoot></tfoot> <thead></thead> <caption></caption> align=”top|bottom|left|right” <col> span=”núm” width=”núm” | "núm%" <colgroup></colgroup> span=”núm” width=”núm” | "núm%" Especifica qué lineas de división aparecen entre las celdas Fila de la tabla Alineación Color de fondo Celda dentro de la fila Alineación horizontal Alineación vertical Fuerza a que el texto ocupe una línea Número de columnas ocupadas por la celda Número de filas ocupadas por la celda Altura (en píxeles o en porcentaje) Anchura (en píxeles o en porcentaje) Color de fondo de la celda Celda de encabezado de la tabla Alineación horizontal Fuerza a que el texto ocupe una línea Número de columnas ocupadas por la celda Número de filas ocupadas por la celda Altura (en píxeles o en porcentaje) Anchura (en píxeles o en porcentaje) Color de fondo de la celda Cuerpo de la tabla Pie de la tabla Cabecera de la tabla Título de la tabla Alineación Columna de una tabla Número de columnas abarcadas Anchura Grupo de columnas de una tabla Número de columnas abarcadas Anchura Formularios <form action="URL"></form> accept="t,t,t" accept-charset="unknown|cad_caracteres" enctype="_tipo_MIME" method=”get|post” Name="cad_caracteres" target=”_blank|_self|_parent|_top|nombre_del_marco” <input> accept="t, t, t" align=”left|right|top|texttop|middle” alt="cad_caracteres" Formulario con página de destino Tipos de contenido que se aceptarán Codificaciones de caracteres aceptadas Tipo de contenido que se enviará Método de envío de datos Nombre del formulario Marco de destino Control del formulario Tipos de contenido que se aceptarán Alineación Texto alternativo si no aparece el control readonly Indica que el control está marcado (radio o checkbox) Deshabilitado Número máximo de caracteres que se aceptan (text o password) Nombre del control Control de sólo lectura (el usuario no lo puede modificar) size=”núm” Tamaño en caracteres (text o password) src="URL" Origen de la imagen para decorar el botón gráfico de envío (image) checked disabled maxlength=”núm” name="cad_caracteres" type="text|password|checkbox|radio|submit|reset|file| hidden|image|button” value="cad_caracteres" tabindex=”núm” <textarea></textarea> cols=”núm” rows=”núm” disabled name="cad_caracteres" readonly tabindex <button></button> disabled name="cad_caracteres" Type= "button|reset|submit" Value="cad_caracteres" tabindex=”núm” <select></select> disabled Tipo de control Valor inicial del control Posición en la navegación con tabulador Número de columnas y filas que ocupa Deshabilitado Nombre del control Control de sólo lectura (el usuario no lo puede modificar) Posición en la navegación con tabulador Botón Deshabilitado Nombre del control Tipo de botón (pulsado, borrado o envío) Valor inicial del control name="cad_caracteres" Posición en la navegación con tabulador Selector de opciones Deshabilitado Indica que se puede seleccionar más de una opción Nombre del control size=”núm” Número de filas de la lista que se mostrarán tabindex=”núm” Posición en la navegación con tabulador Opción seleccionable dentro de la estructura select Deshabilitado Texto de la opción alternativo al contenido de option Opción seleccionada por defecto multiple <option> </option> disabled label="cad_caracteres" selected value="cad_caracteres" tabindex=”núm” Valor inicial del control Posición en la navegación con tabulador Marcos (frames) <frameset> </frameset> rows=”,,,” cols=”,,,” <frame> src="url" name="cad_caracteres"|_blank|_self|_parent|_top” marginwidth=”núm” marginheight=”núm” scrolling="yes|no|auto" noresize frameborder="yes|no" <noframes> </noframes> <iframe> </iframe> width=”núm” | "núm%" height=”núm” | "núm%" Página de marcos (sustituye a BODY) Marcos en filas (se separan las medidas de cada marco mediante comas) Marcos en columnas (se separan las medidas de cada marco mediante comas) Marco Página inicial que contendrá el marco Nombre del marco Márgenes izquierdo y derecho Márgenes superior e inferior Barra de desplazamiento del marco Marco no redimensionable Muestra u oculta el borde Contenido que se mostrará si el navegador no soporta marcos Inserta un marco dentro de un bloque de texto Anchura y altura (en píxeles o en porcentaje)
© Copyright 2024