CODIGO HTML

HTML, siglas de

HyperText Markup Language

(Lenguaje de Marcas de Hipertexto),

es el lenguaje de marcado predominante para la construcción de páginas Web

LENGUAJE DE MARCADO

• Un lenguaje de marcado o lenguaje de marcas es una forma de codificar un documento que, junto con el texto, incorpora etiquetas o marcas que contienen información adicional acerca de la estructura del texto o su presentación. El lenguaje de marcas más extendido es el Código de HTML

PAGINA Web• Una página Web, también conocida

como página de Internet, es un documento: Un documento es el testimonio material de un hecho o acto realizado en el ejercicio de sus funciones por instituciones o personas físicas, adaptado para una pagina Web: Una página Web es un documento típicamente común a Internet una página Web es realizado en el código HTML.

EL LENGUAJE DE MARCADO HTML

• Es usado para describir la estructura y el contenido en forma de texto, así como para complementar el texto con objetos tales como imágenes.

• El código HTML se escribe en forma de "etiquetas”, rodeadas por corchetes angulares (<,>)

ETIQUETAS

• Las etiquetas es en qué juego de caracteres está la página, de qué tipo es cada uno de los fragmentos de texto que contiene (por ejemplo, encabezamiento, texto normal, etc.), si están alineados a un lado o centrados, en qué tipo de letra está el texto (cursiva, negrita, etc.), si hay tablas, de qué anchura son etc.

CORCHETES ANGULARES (<,>)

• Los corchetes angulares o las balizas dan al navegador las instrucciones necesarias para que presente la página en pantalla.

ELEMENTOS DEL HTML

• Los elementos son la estructura básica de HTML.

• Los elementos tienen dos propiedades básicas: Atributos y contenido.

• Cada atributo y contenido tiene ciertas restricciones para que se considere válido al documento HTML.

ATRIBUTOS• Un atributo es un apéndice de un rótulo

HTML que extiende o califica su significado. Los mas importantes son:

Align: Alinea horizontalmente la tabla con respecto a su entorno.

Background: Nos permite colocar un fondo para la tabla a partir de un enlace a una imagen.

Bgcolor: Da color de fondo a la tabla. Border: Define el número de pixels: Puntos.

Unidad de medida que expresa la capacidad de la pantalla de un monitor. El número de pixels o puntos de una pantalla informa sobre su resolución.

Bordercolor: Define el color del borde. Cellpadding: Define, en pixels, el

espacio entre los bordes de la celda y el contenido de la misma.

Cellspacing: Define el espacio entre los bordes (en pixels).

Height: Define la altura de la tabla en pixels o porcentaje.

Width: Define la anchura de la tabla en pixels o porcentaje.

TABLAS EN HTML

• Las tablas son la manera más sencilla de organizar el contenido en una página Web.

• Nos permiten delimitar de qué lugar a qué lugar deseamos que se muestre el contenido.

QUE NOS PERMITE UNA TABLA EN HTML

• Una tabla nos permite organizar y distribuir los espacios de la manera más optima. Nos puede ayudar a generar texto en columnas como los periódicos, prefijar los tamaños ocupados por distintas secciones de la página o poner de una manera sencilla un pie de foto a una imagen.

ESTRUCTURA DE UNA TABLA

• Las tablas están formadas por filas, columnas y celdas.

• Cada espacio horizontal continuado es una fila y cada espacio vertical continuado es una columna, definiéndose una celda como el espacio formado por la intersección de una fila y una columna.

Columna 1 Columna 2 Columna 3

CELDA(1,1)

CELDA(1,2)

CELDA(1,3)

CELDA(2,1)

CELDA(2,2)

CELDA(2,3)

CELDA(3,1)

CELDA(3,2)

CELDA(3,3)

Fila 1

Fila 2

Fila 3

• Lo primero que tenemos que hacer cuando queremos realizar una tabla es decirle al navegador dónde empieza y dónde acaba esta; esto se consigue mediante la etiqueta de inicio <TABLE> y su correspondiente etiqueta de cierre </TABLE>.

• TABLE: Es la marca de comienzo y final de la tabla.

• Seguidamente debemos decirle cuantas filas vamos a tener en nuestra tabla, cosa que hacemos con las etiqueta de inicio de fila <TR> y su correspondiente etiqueta de cierre de fila</TR>, por lo que deberemos insertar una pareja de etiquetas por cada fila que queramos que tenga la tabla.

• TR: Viene de table row que significa fila de la tabla.

• Por último, dentro de cada fila deberemos indicar cuantas celdas va a haber, que inicialmente deben corresponderse con el número de columnas que deseemos tenga la tabla. Esto se consigue mediante las parejas de etiquetas <TD> y </TD>.

• TD: Viene de table data que significa dato de la tabla.

<TABLE>

<TR>

<TR>

<TR>

<TD>.</TD> <TD>.</TD> <TD>.</TD>

</TR>

</TR>

</TR>

<TD>.</TD> <TD>.</TD> <TD>.</TD>

<TD>.</TD> <TD>.</TD> <TD>.</TD>

</TABLE>

Este es el esquema general de toda tabla simple, que traducido a código HTML quedaría de la forma: <TABLE>    <TR>      <TD> celda(1,1) </TD>      <TD> celda(1,2) </TD>      <TD> celda(1,3) </TD>    </TR>    <TR>      <TD> celda(2,1) </TD>      <TD> celda(2,2) </TD>      <TD> celda(2,3) </TD>    </TR>    <TR>      <TD> celda(3,1) </TD>      <TD> celda(3,2) </TD>      <TD> celda(3,3) </TD>    </TR> </TABLE>