Manual HTML Aversitenteras

16 pasos sencillos para construir tu propia web




3. FORMATOS FÍSICOS



.

En cuanto al formato de los caracteres vamos a distinguir dos tipos en este manual: Los formatos físicos y los formatos lógicos.

bullet  Formatos físicos:

Son los que definen como se va a presentar el texto independientemente que tipo de texto sea. Son formatos físicos por ejemplo la negrita, el subrayado... Aquí tenemos una lista de algunos de ellos.

<B> ... </B>
Negrita

<SUB> ... </SUB>
M Subíndice

<I> ... </I>
Cursiva

<SUP> ... </SUP>
M Superíndice

<U> ... </U>
Subrayado

<TT> ... </TT>
Máquina escribir

<S> ... </S>
Tachado


Ejercicio: En el siguiente ejercicio veremos claramente cómo utilizar estas etiquetas de formato físico, así que como siempre abriremos el Bloc de notas (Notepad) y escribiremos el siguiente código:

<HTML>
<HEAD>
<TITLE>Formatos físicos</TITLE>
</HEAD>
<BODY>
<B>Este texto está en negrita</B>
<I>en cambio este está en cursiva</I>
<U>también se puede subrayar</U>
<S>y tachar</S>
<B><I><U>Se pueden usar</U> varios a</I> la vez</B>
Ejemplo de superíndice: 6<SUP>2</SUP>=36
Ejemplo de subíndice: X<SUB>1</SUB> + X<SUB>2</SUB> = Z
</BODY>
</HTML>

En las tres primeras líneas está muy clara la utilización de las etiquetas, se abren justo antes de la frase que se quiera contenga el formato indicado en la etiqueta y se cierra inmediatamente después. Pero centremos nuestra atención en la línea siguiente. Lo que vemos aquí es lo que se conoce como anidar etiquetas o lo que es lo mismo usar diferentes etiquetas en una misma porción de código, siguiendo una determinada estructura. La forma correcta de anidar las etiquetas es teniendo en cuenta el orden de apertura y de cierre de ellas de manera que si abro primero la negrita, luego la cursiva y por último el subrayado (es nuestro caso en el código) deberemos cerrar primero la última (subrayado), luego la siguiente (cursiva) y por último la primera que se abrió (negrita).

Guardamos este ejercicio como ejercicio2.htm y lo ejecutaremos. Este debe ser el resultado:


formatos fisicos


Viendo el resultado os habrá sorprendido que todas las frases se visualicen una detrás de otra y no una en cada línea como seguramente esperabais, y es que hay que indicarle al navegador cuando queremos saltar de línea. Esto se hace mediante la etiqueta <BR>, que dada su concreta función es una etiqueta que no tiene etiqueta de cierre.

Como alternativa a los saltos de línea también existe la etiqueta <P> que entre su etiqueta de apertura y cierre delimita un párrafo y la línea horizontal <HR>.


Ejercicio:  Vamos a utilizar esto último usando el ejercicio anterior:

<HTML>
<HEAD>
<TITLE>Formatos físicos</TITLE>
</HEAD>
<BODY>
<B>Este texto está en negrita</B><BR>
<I>en cambio este está en cursiva</I><BR>
<U>tambien se puede subrayar</U><BR>
<S>y tachar</S><BR>
<B><I><U>Se pueden usar</U> varios a</I> la vez</B>
<HR>
Ejemplo de superíndice: 6<SUP>2</SUP>=36<BR>
Ejemplo de subíndice: X<SUB>1</SUB> + X<SUB>2</SUB> = Z
<P>
Esto es un párrafo.
</P>
<P>
Siguiente párrafo.
</P>
</BODY>
</HTML>

Guardamos como ejercicio3.htm, lo ejecutamos en el navegador y comprobamos que nos da este mismo resultado:


formatos fisicos bis



anterior     indice     siguiente