Curso completo de HTML - Texto preformateado

11 - Texto preformateado

[editar]

Curso gratis creado por Jorge Ferrer, Víctor García y Rodrigo García. Extraido de: http://es.tldp.org/Manuales-LuCAS/doc-curso-html/doc-curso-html/

23 de Febrero de 2006

< anterior | 1 ... 9 10 11 12 13 14 15 ... 75 | siguiente >

En ocasiones es interesante mantener los espacios o saltos de línea de un párrafo tal y como están en el código HTML. Para conseguir esto hay que alterar el comportamiento habitual del navegador que, como se ha visto, ignora este formato. Un ejemplo muy simple que muestra esto es la firma de páginas con dibujos de texto como el de la figura 3.10.

Figura 3.10. Como se puede ver se pueden crear firmas muy originales usando únicamente caracteres y sin necesidad de imágenes.

Se podría crear una imagen con él e insertarla en el documento, pero este es un dibujo hecho con caracteres y podría aprovecharse para que pudiese verse también con navegadores que trabajan en modo texto como Lynx. Algo importante en este caso ya que interesa que TODO el mundo vea la firma, además de que el tenerla como texto hace más fácil su modificación.

Sin embargo todos los espacios múltiples se convertirán en un único espacio, y por tanto si se escribiese el dibujo junto con el código HTML el navegador lo mostraría como vemos en la figura 3.11 :

Figura 3.11. Si no usamos la etiqueta de texto preformateado la figura construida con caracteres se convertirá en algo ilegible.

que sin duda no es el resultado que esperábamos.

Aunque este es un ejemplo entre muchos, el objetivo era resaltar que en ocasiones esa característica de HTML de eliminar todo formato manual en el texto es verdaderamente incómoda. Pero todo problema tiene solución, y en este caso la solución es una nueva etiqueta: <PRE>...</PRE> . El nombre asignado a esta etiqueta proviene de la palabra "PREformateado" (o PREformatted en inglés) y su función es mantener todo formateado manual que sea hecho en el texto escrito entre la instrucción de inicio (<PRE>) y la instrucción de fin (</PRE>).

Continuando con el ejemplo de nuestra firma, el problema se podría solucionar si al insertarla la incluimos dentro de la etiqueta PRE de la siguiente manera:

      <PRE>
                   ( @ @ )
       ---------oOOo-(_)-oOOo---------
       |                               |
       |     Juan Juanito Juanez       |
       |   E-mail: juan@juanito.ju     |
       |                               |
       -----------------Oooo.---------
             .oooO     (   )
             (   )      ) /
              \ (      (_/
               \_)
       </PRE%gt;

En este caso la visualización será la esperada, es decir la de la figura 3.10.

Es común en los nuevos programadores que descubren la etiqueta PRE usarla abundantemente, sin embargo, esto puede causar problemas de visualización de esas páginas con algunos tamaños de ventana, resoluciones de pantalla o tipos de monitor distintos del nuestro. Recordemos que esta era la razón por la que los navegadores ignoraban el formato manual y debido a ello el uso de PRE debe estar limitado a los casos en los que sea realmente necesario.

Uso de otras etiquetas dentro de `<PRE>`...`</PRE>`

A efectos de HTML estándar, el contenido de la etiqueta PRE es el mismo que el de un párrafo creado con P. Las únicas excepciones son aquellos elementos que producen cambios en el tamaño de la letra como por ejemplo IMG, BIG, SMALL, SUB, SUP y FONT. Esto excluye también a todas aquellas etiquetas que provocan un cambio de línea (son las llamadas etiquetas de nivel de bloque, block-level tags) como son: H1,..., H6, BLOCKQUOTE, ADDRESS, HR, etc.

Tanto Netscape como Explorer permiten el uso de todo tipo de etiquetas dentro del texto preformateado, incluso aquellas etiquetas de nivel de bloque. En estas últimas hay ligeras diferencias entre Explorer y Netscape, valga como ejemplo que los encabezados en Explorer mantienen el tipo de letra del texto preformateado (generalmente Courier New) mientras que Netscape los muestra con el tipo de letra normal (generalmente Times New Roman).

[editar]

< anterior | 1 ... 9 10 11 12 13 14 15 ... 75 | siguiente >

Opinar
192 opiniones

sara

deberian poner como hacer un enlace a otra pagina desde un boton

luis

este tutorial esta fabuloso!

esta chivo

gracias por publicar cosas buenas

OCHOA

BUENO

OCHOA

El comentario de algo asi me interesa a mi tambien.

1 2 3 4 5 6 7 ... 39 | siguiente >

Cursos gratis relacionados con 'Curso completo de HTML'

Curso completo de HTML

Este es un curso tremendamente completo, guiado y con ejemplos y prácticas pensadas para convertirlo... Más »

Curso de Ada

El objetivo de este curso es aprender a programar en el lenguaje Ada, desde sus... Más »

Curso de hacking

Práctico y completo curso de hacking.

Curso de Linux

Completo curso de Linux, un sistema operativo gratuito y de libre distribución inspirado en el... Más »

El fascinante mundo de los virus informáticos

Completo curso acerca de los virus informáticos, historia, clasificación, protección...

Anuncios Google

Autor y licencia de 'Curso completo de HTML'

Curso gratis de Jorge Ferrer, Víctor García y Rodrigo García. Extraido de: http://es.tldp.org/Manuales-LuCAS/doc-curso-html/doc-curso-html/ CopyLeft

Licencia GNU Free Documentation License: http://www.gnu.org/copyleft/fdl.html

Este contenido ha sido recopilado por el equipo de Wikilearning. Todo el contenido recopilado se ha obtenido respetando y comunicando en nuestro site la licencia de cada fuente.

Wikilearning tiene permiso expreso por escrito de los autores para publicar los contenidos que ha extraído de otras webs, incluyendo su uso comercial.