HTML Y CSS.
Introducción
Lo primero a explicar es en qué consisten los símbolos de mayor y menor que aparecen habitualmente en el texto fuente de las páginas web. El lenguaje HTML se basa en la sintaxis SGML, esto quiere decir que cualquier cosa que hagamos en HTML estará encerrada entre etiquetas de esta manera: <ETIQUETA parámetros> ... </ETIQUETA>.
Hay ocasiones en que no es necesario cerrar la etiqueta. Mirando el código se pueden ver un par de casos así, que se explicarán más adelante. Lo primero que debemos indicar es que el texto que estamos componiendo es un documento HTML, cuyo inicio y final serán respectivamente:
<HTML> ... </HTML> Un documento HTML tiene una estructura que lo separa en dos partes: cabecera y cuerpo. En la segunda estará la página en sí, mientras que en la primera se ubica información que no ve el usuario final, pero que puede llegar a ser muy importante. Lo primero que hay que incluir en el código es la cabecera.
La escribimos: <HEAD> <TITLE>Página de Rafa</TITLE></HEAD> Aquí dentro de la cabecera sólo hay otra etiqueta.
Es la única imprescindible: el título de la página, es lo que veremos como título de la ventana en los navegadores que lo permitan. Es como se conocerá nuestra página en algunos buscadores y en la agenda de direcciones (bookmarks) de los usuarios. Por tanto, es importante poner un nombre indicativo del contenido de la página.
El cuerpo del documento. Ahora vamos a indicar el contenido. Lo primero será describir que estamos en el cuerpo del documento, que se delimita con:
<BODY>... </BODY>
Luego pondremos el título destacado:
<CENTER><H1>... </H1></CENTER>
Con esto colocaremos el texto centrado (<CENTER>)y en formato <H1> (cabecera 1) que nos asegura que aumentará el tamaño del tipo de letra lo suficiente como para que se vea resaltado. Luego separamos ese título que le hemos puesto a la página del texto por medio de una línea horizontal:
<HR> La línea horizontal carece de etiqueta de cierre.
Esto es normal en etiquetas que no varían los atributos de un texto, sino que insertan un elemento.
Por ejemplo, para indicarle que queremos separar el texto de la línea horizontal con un espacio vertical correspondiente a un párrafo nuevo.
- Formato básico
Se pueden establecer varias categorías dentro de las etiquetas usadas para dar formato al texto. Habitualmente se suelen dividir entre aquellas que sirven para cambiar párrafos enteros y las que son capaces de formatear tiras de caracteres dentro del párrafo.
- Formato del párrafo
Estas son las etiquetas más importantes (excluyendo algunas que veremos más adelante):
- Etiqueta Utilidad Resultado
<P>
Sirve para delimitar un párrafo. Inserta una línea en blanco antes del texto.
Soy un párrafo
<CENTER> ... </CENTER>
Permite centrar todo el texto del párrafo.
Yo soy normalYo estoy centrado
<PRE WIDTH=x> ... </PRE>
Representa el texto encerrado en élla con un tipo de letra de paso fijo. Muy útil a la hora de representar código fuente. El parámetro WIDTH especifica el número máximo de caracteres en una línea.
Estoy en paso fijo
<DIV ALIGN=x> ... </DIV>
Permite justificar el texto del párrafo a la izquierda (LEFT) derecha (RIGHT), al centro (CENTER)o a ambos márgenes (JUSTIFY)
Yo estoy a la izquierda
Yo al centro
Y yo a la derecha (recuerda al PP)
Para justificar la aparición en muchos sitios.
<ADDRESS>... </ADDRESS>
Para escribir direcciones (donde vive la gente).
Marisol Soto, Calle Desengaño 5 1º
<BLOCKQUOTE>... </BLOCKQUOTE>
Para citar un texto ajeno. Se suele implementar dejando márgenes tanto a izquierda como a derecha, razón por la que se usa habitualmente.