Html para principiantes II

Presentamos un curso de HTML, desde nivel básico hasta un nivel avanzado el cual os permitirá conocer este lenguaje a fondo, su utilización, y su función en la “Red de redes”. Segunda entrega.

Decorando el texto

El texto de la página se puede, obviamente cambiar de estilo. Lo que cambiará de estilo es lo que vaya entre las etiquetas.

Las etiquetas necesarias son instrucciones dobles, y son las siguientes:

<B> negrita </B> : Negrita

<U> subrayado </U> : Subrayado

<I> cursiva </I> : Cursiva

<S> tachado </S> : Tachado

Encabezados

El tamaño de letra en código HTMl, no es lo mismo que en un procesador de texto. No le podemos asignar con HAML estricto un cuerpo determinado a una letra, sino que hay que utilizar lo que se denomina encabezado. Estos encabezados, se utilizan normalmente para crear títulos en las páginas con tamaños de letras de tamaño superior a lo normal.

Son también instrucciones dobles, y sus etiquetas son las siguientes:

<H1> argumento </H1>

<H2> argumento </H2>

<H3> argumento </H3>

<H4> argumento </H4>

<H5> argumento </H5>

<H6> argumento </H6>

Cuanto menor es el número, mayor es el tamaño de la letra. Es inversamente proporcional el tamaño de la letra con el número colocado.

Etiqueta FONT

Es una instrucción doble <FONT> </FONT>

Su uso es dar formato al texto

Se le puede añadir parámetros, como el tamaño: <FONT SIZE = 1> </FONT>

Los tamaños oscilan desde el 1 al 7. El tamaño standard es 3.

Etiqueta FACE

Con esta etiqueta lo que se indica el tipo de letra. Llegados a este punto, debes tener en cuenta que no todos los usuarios tienen instalados los mismos tipos de letra, lo que produce que si en esta etiqueta utilizas un tipo de letra que no lo posea el visitante, el navegador utilizará el tipo de letra que tenga por defecto configurado el usuario. Hay tipos de letras comunes a los usuarios.

Esta etiqueta será colocada junto a la de FONT, para indicar el tipo de letra, ya que por sí sóla no tiene ninguna función

Los parámetros que coloquemos en esta etiqueta deberán ir entre comillas.

Por ejemplo: <FONT FACE = “Verdana”> El correspondiente argumento </FONT>. Con esto indicaremos que el tipo de letra que vaya entre estas etiquetas será Verdana.

Etiqueta COLOR

Es otra etiqueta que atribuye una característica, tanto a un texto como a un fondo, por ejemplo. Se puede utilizar con la etiqueta FONT y lo que obtendremos será un color determinado del texto.

<FONT FACE=”Verdana” COLOR=”Red”>

Esta etiqueta admite los parámetros de dos formas distintas:

La primera escribiendo el color en inglés.

La segunda mediante la numeración del color en formato hexadecimal. Este formato tiene la siguiente estructura: # 00FFFF

Alineando el texto

Por supuesto una vez escrito el texto se puede colocar a nuestro antojo, o dependiendo de nuestras necesidades.

Para colocarlo en las distintos lugares de la página se utilizan las siguientes etiquetas:

<CENTER> Argumento </CENTER>: Con esta etiqueta el texto se alineará al centro.

<P ALIGN = “left” >: El texto quedará alineado a la izquierda.

<P ALIGN = “center” >: El texto se alineará al centro.

<P ALIGN = “right” >: El texto se alineará a la derecha.

La etiqueta <P> indica un final de párrafo. Se puede sustituir por <BR> <BR> que son dos saltos de línea.

Colocando imágenes

Sin duda uno de los mayores atractivos de las páginas web, en muchos casos, son la introducción de imágenes. Vamos a ver como se hace.

La gran mayoría de los navegadores admiten dos formatos de imagen, el formato GIF y el JPG. En la actualidad algunos navegadores admiten más pero eso lo dejaremos para los profesionales, y para tus pruebas posteriores.

Insertar una imagen

La etiqueta para poder insertar una imagen es <IMG>

<IMG SRC = “foto1.gif”>

Para colocar una imagen hay que colocar la ruta completa del archivo de tu disco duro. Cuando creamos un sitio web, partimos de una carpeta en el cual colocaremos todos nuestros archivos. Aún así deberemos colocar la ruta completa para que el navegador pueda encontrar dicha foto. Un ejemplo es que si nuestra “foto1.gif, se encuentra en la carpeta fotos, la ruta completa sería:

<IMG SRC = “fotos/foto1.gif”>