3.9. Código

3.9.1. Código en línea

Utiliza el elemento <code> para encerrar los fragmentos de código fuente que se muestran en línea con el texto. Ejemplo:

<p>El elemento <code>&lt;section&gt;</code> es uno de los nuevos elementos de HTML5.</p>

Así se ve este ejemplo en tu navegador:

Y esta es la imagen del aspecto que debería tener este ejemplo:

Figura 3.22 Código en línea en Bootstrap 3

3.9.2. Bloques de código

Cuando quieras mostrar bloques de código, utiliza la etiqueta <pre> y asegúrate de reemplazar los caracteres < por < y > por > para evitar problemas al mostrar el código. Ejemplo:

<pre>&lt;p&gt;Así se escribe un párrafo de texto&lt;/p&gt;</pre>

Así se ve este ejemplo en tu navegador:

Y esta es la imagen del aspecto que debería tener este ejemplo:

Figura 3.23 Bloque de código en Bootstrap 3

Cuando muestres bloques de código muy largos, quizás prefieras utilizar la clase .pre-scrollable para limitar su altura a un máximo de 350px y añadir una barra de scroll al código.