Guía Rápida de Etiquetas HTML

Gua Rpida de Etiquetas HTML & XHTML
Esta gua de referencia denota algunas de las etiquetas ms usadas en HTML y XHTML.
Etiquetas bsicas de Documento Etiqueta <html></html> <head></head> Funcionamiento Indica el inicio y el final de un documento html Define la porcin de Documento que contiene informacin esencial para el formato del documento. El material dentro de esta etiqueta es invisible. Define la porcin de documento que contiene la informacin visible, en otras palabras es el cuerpo del documento, en donde se encuentra el contenido visible que muestra el navegador web.
<body></body>
Atributos de la etiqueta <BODY> Atributo Funcionamiento <body bgcolor=? > Indica el color del fondo del cuerpo de la pgina. <body text=? > Indica el Color del Texto contenido dentro de la etiqueta. <body link=? > Indica el color de los Link que no han sido visitados, que estn contenidos dentro de etiqueta < body>. <body vlink=? > Indica el color de los Link que han sido visitados, que estn contenidos dentro de etiqueta < body>. Indica el color de los Links cuando se les da <body alink=? > Click, que estn contenidos dentro de la etiqueta <body> Es posible combinar los atributos dentro de la etiqueta <body> ej. <body bgcolor="#FFFFFF" text="#000000" link="#0000CC" vlink="#33CC00" alink="#FF0000">
Este documento es una traduccin de: http://library.albany.edu/imc/pdf/HTMLXHTML_Tag_Sheet.pdf cualquier correccin o comentario favor enviar un correo a: [email protected].
Etiquetas de Texto Atributo <h1></h1>, <h2></h2>,<h3></h3>, <h4></h4>,<h5></h5>,<h6></h6> Funcionamiento Las etiquetas de titulo indican la importancia del titulo, empezando del ms importante, h1, hasta el menos importante h6. Estas especificaciones intentan denotarla importancia de los datos que se encuentran debajo del titulo. Especifica la fuente del texto en una llamada teletype. Crea nfasis en un texto, el que es representado en negrita, pero algunas veces en itlica, dependiendo del navegador. Crea nfasis en un texto el cual es representado en negrita. Especifica el tamao de la letra de 1 al 7, donde 1 es la ms pequea y 7 la ms grande. Por defecto el tamao de la letra es 3. Especifica el color de la letra. Nota: La mejor prctica es evitar el uso de etiquetas de texto. El texto es formateado usando hojas de estilo en cascada (CSS).
<tt></tt> <em></em>
<strong></strong> <font size=?></font>
<font color=?></font> Nota: El atributo Font puede ser combinado con la etiqueta <font>, ejemplo: <font size="4" color="#33FF00">Ejemplo combinando atributos font </font>
HTML <p></p> <p aling=?></p>
Etiquetas de Formato Comn XHTML
<br> <blockquote></ blockquote>
<br/>
<ol></ol> <ul></ul> <li></li>
Que hace. Define un prrafo. Define un prrafo con alineacin en el centro, derecha o izquierda. Salto de lnea. Define una cita de texto e identa el texto en ambos extremos. Usualmente con espacio extra sobre y bajo el texto. Define el inicio y el fin de una lista ordenada. Define el inicio y el fin de una lista desordenada. Define el inicio y el fin de una lnea dentro de una lista. En una lista ordenada, inicia con
un nmero y con un punto en una lista desordenada.
HTML <img src=name> <img src=name border=?>
Que hace. Ubica una imagen. Especfica la alineacin de la imagen, derecha, izquierda, centro; inferior, superior, medio. <img src=name <img src=name Especfica la etiqueta alt=name> alt=name/> alternativa para una imagen. Esto es especialmente importante para los navegadores no grficos. Nota: Los atributos dentro de la etiqueta img pueden ser combinados. Ejemplo en HTML: <img src=images/unilogo.jpg width=209 height=214 alt=logo uni> Ejemplo en XHTML: <img src=images/unilogo.jpg width=209 height=214 alt=logo uni />
Etiquetas de Imgenes. XHTML <img src=name /> <img src=name border=?/>
HTML <hr> <hr size=?> <hr noshade>
Etiqueta de regal horizontal. XHTML <hr/> <hr size=?/> <hr noshade/>
Que hace. Especifica el inicio de una lnea horizontal. Especifica el grosor de la lnea horizontal. Indica que la lnea horizontal no tendr sombra.
Nota: Los atributos dentro de la etiqueta hr pueden combinarse. Ejemplo en HTML: <hr noshade width=75% size=4> Ejemplo en XHTML: <hr noshade width=75% size=4 />
<table></table> <tr></tr> <td></td> <th></th>
<table border=#></table> <table cellspacing=#></table> <table cellpadding=#></table> <table width=?></table> <tr aling=?> <td aling=?>
<tr valing=?>
<td valing>
<td colspan=#> <td rowspan=#> <td nowrap>
Etiquetas de tablas Especifica el inicio y el fin de una tabla. Especifica el inicio y el fin de una fila. Especifica el inicio y el fin de una celda. Especifica la cabecera de una tabla. Una celda normal donde el texto esta en negrita y centrado. Especifica el tamao del borde alrededor de la tabla y las celdas dentro de la tabla. Especifica el tamao entre las celdas. Especifica la cantidad de espacio entre el borde de la celda y los datos dentro de la celda. Especifica la anchura de la tabla en pixeles o en porcentaje. Especifica la alineacin del contenido en una fila (left, right,center). Especfica la alineacin del contenido de una celda ya sea como derecha, izquierda o centrado. Especifica el alineamiento vertical de una fila que contiene celdas, ya sea superior, inferior o medio (top, bottom, middle). Especifica el alineamiento vertical en una celda ya sea superior inferior o medio (top, bottom, middle). Especifica el nmero de columnas que va a cubrir la celda. Especifica el nmero de filas que va a cubrir una celda. Detiene el texto de una lnea automtica de envoltura.
XHTML puede ser visto como una mejora y una versin estricta del HTML 4.01. No es ms difcil escribir XHTML que escribir HTML bien formado. Hay algunas reglas que tiene que ser cumplidas. Las reglas ms importantes son: Las etiquetas en XHTML deben de escribirse en minscula. Las etiquetas en XHTML deben de estar anidadas correctamente. Toda etiqueta en XHTML debe de tener una etiqueta de cierre. Los documentos escritos en XHTML deben de estar bien formados.
Ejemplo de la regla de las minsculas: <STRONG> Esto es incorrecto</STRONG> <strong> esto esta correcto </strong> Ejemplo de la regla de anidacin: <strong><em> Esto esta incorrecto</strong></em> <strong><em> Esto esta correcto</em></strong> Ejemplo de cierre de etiquetas: La etiqueta de regla horizontal no est cerrada <hr>. La etiqueta de regla horizontal cerrada <hr/>. La etiqueta de imagen no est cerrada <img source=../img/UNILogo.png alt=logo>. La etiqueta de imagen cerrada <img source=../img/UNILogo.png alt=logo />. Ejemplo de un documento XHTML bien formado: Los documentos XHTML deben tener la estructura apropiada. Esto significa que todos los elementos deben de estar dentro de las etiquetas de apertura y cierre HTML, <html></html>. Los elementos internos deben de estar correctamente anidados. Los componentes bsicos y estructura de un documento XHTML son: <html> <head> </head> <body> </body> </html>
Reglas de Sintaxis del XHTML.
XHTML requiere que sean cumplidas algunas reglas de sintaxis. Como las reglas de las etiquetas que vimos arriba, la sintaxis XHTML no es ms difcil que un documento HTML correctamente formado. Sin embrago estas reglas son mas estrictas y no deben ser viol adas. Estas reglas son las siguientes. Los atributos deben de estar entre comillas. El atributo NAME es remplazado por el atributo ID. El atributos de tipo shorthand no deben ser usados. La declaracin DOCTYPE debe ser usada. (la declaracin DOCTYPE es parte de la definicin de tipo de documento DTD o sus siglas en ingles Document Type Definition y es usado para especificar que sintaxis es usada en la pgina web).
Ejemplo de atributos entre comillas: Esto es incorrecto <table width=75% bgcolor=FF0000 > Esto es correcto <table width=75% bgcolor=FF0000 > Ejemplo del remplazo del atributo NAME: Esto es incorrecto <img src=../images/UNILogo.png alt=logo name=imagenlogo / > Esto es correcto <img src=../images/UNILogo.png alt=logo ID=imagenlogo /> Ejemplo de atributos de tipo SHORTHAND: Este es el ejemplo de un shorthand inapropiado <input type=checkbox checked / > Este ejemplo esta escrito correctamente sin shorthand <input type=checkbox checked=checked / > Ejemplos de declaracin de DOCTYPE: <html> <head> <title> Esta es una pgina sin declaracin DOCTYPE</title> </head> <body></body> </html> Este documento es una traduccin de: http://library.albany.edu/imc/pdf/HTMLXHTML_Tag_Sheet.pdf cualquier correccin o comentario favor enviar un correo a: [email protected].
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>Ejemplo de una pgina con declaracin DOCTYPE </title> </head> <body> </body> </html> Hay que notar que la declaracin del DOCTYPE va antes de la etiqueta de apertura del html. La declaracin no es parte del documento HTML y no debe llevar etiqueta de cie rre, este es usado para decirle al navegador como mostrar el documento. Hay tres tipos de declaraciones DOCTYPE. HTML 4.01 Strict <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> Esto declara el documento para ser HTML 4.01 estricto. El HTML 4.01 estricto es ajustado abajo de la versin del HTML 4.01 que acenta la estructura sobre la presentacin, esto quiere decir que aquellos atributos que son mas para presentacin no son validos en este tipo de declaracin DOCTYPE. Ejemplo: <table bgcolor=FF0000 >. Esto no es vlido. Lo que se hace en el caso de trabajar con declaracin de DOCTYPE tipo strict.dtd para dar presentacin a nuestra pgina es usar hojas de estilo en cascada (CSS), de esta forma se separa la presentacin de la estructura de la pgina. HTML 4.01 Transitional <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> Este DOCTYPE contiene todos los elementos y atributos, incluyendo los de presentacin y elementos obsoletos como <font>, no contiene frameset.
HTML 4.01 Frameset <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> Es igual al Transitional, solamente que este admite frameset. Este documento es una traduccin de: http://library.albany.edu/imc/pdf/HTMLXHTML_Tag_Sheet.pdf cualquier correccin o comentario favor enviar un correo a: [email protected].
XHTML 1.0 Transitional. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> Este es similar al Transitional de HTML 4.01, con la nica diferencia que el documento debe estar escrito como XML bien formado. XHTML 1.0 Frameset. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> Es igual al XHTML 1.0 Transitional, pero este admite frameset. En cuanto a los DOCTYPE hay ms, pero este curso se har uso de los DTD XHTML.

Guía Rápida de Etiquetas HTML

Cargado por

Copyright:

Formatos disponibles

Guía Rápida de Etiquetas HTML

Cargado por

Información del documento

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Guía Rápida de Etiquetas HTML

Cargado por

Copyright:

Formatos disponibles

Gua Rpida de Etiquetas HTML & XHTML

<strong></strong> <font size=?></font>

HTML <p></p> <p aling=?></p>

Etiquetas de Formato Comn XHTML

<br> <blockquote></ blockquote>

<ol></ol> <ul></ul> <li></li>

un nmero y con un punto en una lista desordenada.

HTML <img src=name> <img src=name border=?>

Etiquetas de Imgenes. XHTML <img src=name /> <img src=name border=?/>

HTML <hr> <hr size=?> <hr noshade>

Etiqueta de regal horizontal. XHTML <hr/> <hr size=?/> <hr noshade/>

<table></table> <tr></tr> <td></td> <th></th>

<td colspan=#> <td rowspan=#> <td nowrap>

Reglas de Sintaxis del XHTML.

También podría gustarte