• 1. Elemento pre
• 2. Elemento code

1. Elemento pre

En algunas ocasiones podríamos necesitar incluír el contenido de un archivo de texto sin perder el formato, es decir conservando los saltos de línea y el espaciado original. Para esto contamos con el elemento pre, que permite representar texto ya preformateado.

Uno de los usos más comunes de este elemento, es la inclusión de código fuente dentro de nuestros documentos. Los navegadores, suelen representar el contenido de la etiqueta pre mediante una fuente monoespaciada.

Ejemplo incluyendo código fuente:

 <pre>
class Libro {
  public:
   Libro();
   void establecerTitulo(char *);
   void establecerPaginas(int);
   void establecerCodigo(int);
   void imprime();
  private:
   char Titulo[40];
   int Cantpaginas;
   int Codigo;
 };
 </pre>

Y el resultado sería:

 class Libro {
  public:
   Libro();
   void establecerTitulo(char *);
   void establecerPaginas(int);
   void establecerCodigo(int);
   void imprime();
  private:
   char Titulo[40];
   int Cantpaginas;
   int Codigo;
 };
 

NOTA: Observar que se respetan en la representación todos los espacios y tabulaciones incluídos, y que no hace falta el uso del elemento de salto de línea br.

2. Elemento code

Hay que tener en cuenta que pre es un elemento en bloque, por lo que no se puede incluír en una línea sin romperla. El elemento equivalente en línea es code, que obviamente no conserva el formato (ya que no puede romper la línea), pero sigue siendo una indicación semántica de la inclusión de código. Además los agentes de usuario suelen representar el contenido de code con letra monoespaciada.

Ejemplo de uso de code:

<p>En el ejemplo anterior incluimos el codigo fuente (en c++) de una clase llamada <strong>Libro</strong>, con
las funciones miembro: <code>Libro()</code>, <code>void establecerTitulo(char *)</code> y <code>void imprime()</code>
entre otras.</p>

El resultado de este párrafo sería:

En el ejemplo anterior incluimos el codigo fuente (en c++) de una clase llamada Libro, con las funciones miembro: Libro(), void establecerTitulo(char *) y void imprime() entre otras.

Cómo notaran incluímos varios etiquetados con code que no rompieron el bloque del elemento superior, párrafo (p).