Estructura de un documento HTML Opcionalmente los documentos escritos en HTML empezarán por la marca y finalizarán con la marca. Esta marca tan solo sirve.

Presentación del tema: "Estructura de un documento HTML Opcionalmente los documentos escritos en HTML empezarán por la marca y finalizarán con la marca. Esta marca tan solo sirve."— Transcripción de la presentación:

1 Estructura de un documento HTML Opcionalmente los documentos escritos en HTML empezarán por la marca y finalizarán con la marca. Esta marca tan solo sirve como identificación del contenido del fichero para ciertos programas que realizan cambios masivos en muchas páginas a la vez. Los documentos escritos en HTML están estructurados en dos partes diferenciadas: la cabecera ( ) y el cuerpo ( ). Opcionalmente los documentos escritos en HTML empezarán por la marca y finalizarán con la marca. Esta marca tan solo sirve como identificación del contenido del fichero para ciertos programas que realizan cambios masivos en muchas páginas a la vez. Los documentos escritos en HTML están estructurados en dos partes diferenciadas: la cabecera ( ) y el cuerpo ( ). Entre las marcas del elemento se podrán utilizar los siguientes elementos: para dar nombre al documento; para dar nombre al documento; para forzar a la página activa a ser cargada cada cierto tiempo. para forzar a la página activa a ser cargada cada cierto tiempo. para prefijar la dirección base de los documentos referenciados mediante un URL relativo. para prefijar la dirección base de los documentos referenciados mediante un URL relativo. HERRAMIENTAS DE INFORMATICA Aqui va el nombre del documento Cuerpo del documento...

2 Estructura de un documento HTML HERRAMIENTAS DE INFORMATICA A continuación se muestra un ejemplo del formato mínimo de la cabecera. Aqui va el nombre del documento Cuerpo del documento... Este ejemplo hace que el browser vuelva a cargar la página cada 10 segundos: Título de la página <META HTTP-EQUIV="Refresh" CONTENT="10; URL=http://miservidor/mipagina.htm">

3 Estructura de un documento HTML HERRAMIENTAS DE INFORMATICA BODY El resto del documento, o sea, todo aquello que no pertenezca a la cabecera, residirá entre y. Esta es la estructura mínima que debe poseer todo documento HTML: Estructura mínima de un documento HTML Documento... COMENTARIOS En el código fuente de una página HTM, los comentarios se introducirán entre las marcas:. Todo texto situado entre dichas marcas será ignorado por el browser, y por tanto no será visible. Ejemplo:

4 Separadores de bloques de texto HERRAMIENTAS DE INFORMATICA P se utiliza para separar párrafos. Dado que para el HTML todo el texto es continuo, necesitamos algún mecanismo para indicar el principio y el fin de un párrafo. Las marcas inicial y final son y. Ejemplo: Este texto está contenido dentro del primer párrafo, así que lo denominaremos: parrafo 1, párrafo 1, párrafo 1, párrafo 1, párrafo 1, párrafo 1, párrafo 1, párrafo 1. Este otro texto está contenido dentro del párrafo 2, párrafo 2, párrafo 2, párrafo 2, párrafo 2, párrafo 2, párrafo 2, párrafo 2. Esto dará como resultado: Este texto está contenido dentro del primer párrafo, así que lo denominaremos: parrafo 1, párrafo 1, párrafo 1, párrafo 1, párrafo 1, párrafo 1, párrafo 1, párrafo 1. Este otro texto está contenido dentro del párrafo 2, párrafo 2, párrafo 2, párrafo 2, párrafo 2, párrafo 2, párrafo 2, párrafo 2.

5 Separadores de bloques de texto HERRAMIENTAS DE INFORMATICA Este elemento admite el atributo ALIGN, que puede tomar uno de los siguientes valores: LEFT: Justifica el texto a la izquierda. (por defecto) RIGHT: Justifica el texto a la derecha. CENTER: El texto aparece centrado. Ejemplo: Texto justificado a la izquierda, texto justificado a la izquierda, texto justificado a la izquierda, texto justificado a la izquierda. Texto justificado a la derecha, texto justificado a la derecha, texto justificado a la derecha, texto justificado a la derecha. Texto centrado, texto centrado, texto centrado, texto centrado, texto centrado, texto centrado. Esto dará como resultado: Texto justificado a la izquierda, texto justificado a la izquierda, texto justificado a la izquierda, texto justificado a la izquierda. Texto justificado a la derecha, texto justificado a la derecha, texto justificado a la derecha, texto justificado a la derecha. Texto centrado, texto centrado, texto centrado, texto centrado, texto centrado, texto centrado.

6 Separadores de bloques de texto HERRAMIENTAS DE INFORMATICA BR El elemento es vacío por lo que sólo tiene marca inicial. Indica un salto de línea. Ejemplo: Texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1. Texto 2, texto 2, texto 2, texto 2, texto 2. Con esto tendremos como resultado: Texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1, texto 1. Texto 2, texto 2, texto 2, texto 2, texto 2. HR es un elemento vacío por lo que solo tiene marca inicial. Se emplea para separar bloques de texto representando una línea horizontal. Se puede cambiar la apariencia de dicha línea mediante los siguientes atributos: NOSHADE: Elimina el efecto de sombra de la línea. WIDTH: Permite definir la longitud de la línea. SIZE: Permite definir el grosor de la línea.

7 Separadores de bloques de texto HERRAMIENTAS DE INFORMATICA PRE El texto insertado entre las marcas y será visualizado por el browser, respetando el formateo tal como haya sido entrado en el fichero fuente HTML, o sea, respetando los espacios y los saltos de linea. Ejemplo: Esto es un texto preformateado, por tanto se respetan los espacios y los saltos de linea, como podrán observar. El resultado será: Esto es un texto preformateado, por tanto se respetan los espacios y los saltos de linea, como podrán observar.

8 Tipos de letra HERRAMIENTAS DE INFORMATICA Hn El elemento se utiliza fundamentalmente para escribir encabezamientos. Asigna un tamaño a los caracteres, dependiendo del valor n, el cual varía de 1 a 6. Los más grandes tienen valor 1 y los más pequeños valor 6. El texto entre estas marcas se trata en negrita. Se inserta automáticamente un salto de párrafo, como puede comprobar en el siguiente ejemplo: Ejemplo: Texto antes de la cabecera. Cabecera Más texto. Esto dará el siguiente resultado: Texto antes de la cabecera. Cabecera Más texto. En la siguiente tabla tiene una muestra del tamaño de letra de cada una de las cabeceras. Cabecera H1 Cabecera H1 Cabecera H2 Cabecera H2 Cabecera H3 Cabecera H3 Cabecera H4 Cabecera H4 Cabecera H5 Cabecera H5 Cabecera H6 Cabecera H6

9 Tipos de letra HERRAMIENTAS DE INFORMATICA FONT El elemento permite definir el tamaño, color y tipo de letra de un conjunto de caracteres mediante los siguientes atributos: El atributo SIZE: Regula el tamaño de los caracteres (1 - 7). El atributo COLOR: Especifica el color de los caracteres. Para consultar los códigos de los colores que le interesen puede consultar la tabla de códigos de colores. El atributo FACE: permite definir el tipo de letra: Algerian, Arial, Times New Roman, Courier, MS Serif, Symbol, System, Times New Roman, Windsort,... Este atributo es soportado tan solo por algunos browsers. (El Netscape no lo reconoce) Ejemplos: Tamaños 1 2 3 4 5 6 7 6 5 4 3 2 1 Colores CO LO RE S. D E. L ET RA S (Ver código fuente) Texto de color verde y tamaño 4. Texto de color verde y tamaño 4. Texto de color rojo y tamaño 6. Texto de color rojo y tamaño 6.