Formato de texto y parrafos en HTML

Dando forma al texto

Como hemos visto en el ejemplo del capítulo anterior, cuando queremos poner un texto sin ninguna caracterísca especial, lo ponemos directamente. Unicamente, la separación entre párrafos (dejando una línea en blanco) la conseguimos con la etiqueta

<P>.

<BR>

Si queremos separar los párrafos, o cualquier otra cosa, pero sin dejar una línea en blanco, usamos una etiqueta parecida <BR> (break, o romper). Tampoco tiene etiqueta de cierre.

 

<P>

Si queremos obtener múltiples líneas en blanco no basta con repetir la etiqueta

<P>, sino que hay que combinarla con la etiqueta <BR>. Así por ejemplo, si queremos obtener cuatro líneas en blanco, pondríamos:

 

<BR><P>

<BR><P>

<BR><P>

<BR><P>

 

&nbsp;

Al escribir el texto, si ponemos más de un espacio en blanco entre dos palabras observamos que el navegador sólo reconoce uno de ellos. Si queremos forzarle a que lo haga, debemos poner el código «&nbsp;» (non-breaking space).

 

 

<B> <I> <U>

Para destacar alguna parte del texto se pueden usar:

 

<B> y </B> para poner algo en negrita (bold).

<I> y </I> para poner algo en cursiva (italic).

<U> y </U> para subrayar algo (underline).

 

<PRE>

Otra etiqueta interesante es <PRE> y </PRE>. El texto que se encuentre entre ella estará preformateado, es decir que aparecerá como si hubiera sido escrito con una máquina de escribir, con una fuente de espaciado fijo (tipo Courier). Además se respetarán los espacios en blanco y retornos del carro, tal como estaban en nuestro documento HTML (lo cual no ocurre normalmente, como hemos visto anteriormente). Es muy apropiada para confeccionar tablas y otros documentos similares.

 

<TT>

Con la etiqueta <TT> y </TT> conseguimos también que el texto tenga un tamaño menor y la apariencia de los caracteres de una máquina de escribir (typewriter). La diferencia con la anterior es que no preformatea el texto, sino que únicamente cambia su apariencia.

 

 

 

<BLOCKQUOTE>

La etiqueta <BLOCKQUOTE> y </BLOCKQUOTE> se utiliza para destacar una cita textual dentro del texto general.

 

<SUP> Y <SUB>

En las fórmulas matemáticas puede interesar poder escribir índices y subíndices, que se consiguen con las etiquetas <SUP> </SUP> y <SUB> </SUB> respectivamente.

 

<UL>

A menudo nos interesará presentar las cosas en forma de listas. Podemos escoger entre tres tipos distintos:

 

1.Listas desordenadas (no numeradas) 2.Listas ordenadas (numeradas) 3.Listas de definición.

 

 

<UL>

<LI> Una cosa

<LI> Otra cosa

<LI> Otra más

<LI> Etc.

</UL>

 

<UL>

<LI> Mamíferos

<LI> Peces

<UL>

<LI> Sardina

<LI> Bacalao

</UL>

<LI> Aves

</UL>

 

Las listas ordenadas (ordered lists) sirven para presentar cosas en un orden determinado. Su estructura es muy similar a la anterior. La diferencia estriba en que en el resultado aparecerá automáticamente un número correlativo para cada cosa.

 

<OL>

<LI> Primera cosa

<LI> Segunda cosa

<LI> Tercera cosa

<LI> Etc.

</OL>

 

Al igual que las listas desordenadas, también se pueden anidar las listas ordenadas.

 

 

 

<!—

Comentarios no visibles en la pantalla

A veces es muy útil escribir comentarios en el documento HTML sobre el código que escribimos, que nos pueden servir para recordar posteriormente sobre lo que hicimos, y que no queremos que se vean en pantalla.

 

Esto se consigue encerrando dichos comentarios entre estos dos símbolos: <!– y –> Ejemplo:

<!-- Esto es un comentario al código que no se verá en pantalla -->

 

 

Ejemplo

<HTML>

<HEAD>

<TITLE> Mi pagina del Web - 2 </TITLE>

</HEAD>

<BODY>

<CENTER>

<H1> Mis aficiones </H1>

</CENTER>

<HR>

Sin un orden particular, mis <B> aficiones </B> son las siguientes:

<UL>

<LI> El cine

<LI> El deporte

<UL>

<LI> Natacion

<LI> Baloncesto

</UL>

<LI> La musica

</UL>

La musica que mas me gusta es  <I> (en orden de preferencia): </I>

<OL>

<LI> El rock

<LI> El jazz

<LI> La musica clasica

</OL>

</BODY>

</HTML>

 

También te podría gustar...

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *