Espacios en blanco HTML. Practicando con caracteres especiales.

Espacios en blanco HTML. Practicando con caracteres especiales.

Print Friendly, PDF & Email
Valora esta entrada

En este ejercicio vamos a aplicar el concepto de códigos de carácter HTML y Nombres HTML.

Cuando aprendemos el uso del <meta charset="utf-8"/> solemos pensar que nunca necesitaremos usar Nombres HTML especiales.

Sin embargo hay ocasiones en las que no hay alternativa o que es una solución práctica. Por ejemplo:

  • Cuando queremos escribir una etiqueta en formato texto y no queremos prescindir de < o >.
  • En los títulos de una publicación o título de una página web cuando escribimos en una página hecha en wordpress.
  • Cuando necesitamos escribir caracteres poco habituales.
  • Para caracteres de uso común como el copyright y similares.

Te sugiero leer esta entrada dónde se explica la teoría y encontrarás ejemplos.

Entremos en materia.

Enunciado

Escribe el html necesario para hacer posible que se visualize el resultado de la imagen.

Observaciones:

El ejercicio está resuelto sin el uso de CSS.

Todas las líneas están resueltas mediante un título <h2>

Ejemplo de usos caracteres HTML
Ejemplo de usos caracteres HTML

Solución del ejercicio

El navegador interpreta dos espacios en blanco como uno solo.

Para forzar espacios en blanco con HTML debemos escribirlos mediante su nombre HTML &nbsp; (non-breaking space)

<h2>Lorem ipsum</h2>
<h2>Lorem &nbsp; ipsum</h2>
<h2>Lorem &nbsp;&nbsp;&nbsp;ipsum</h2>
<h2>Lorem &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ipsum</h2>
<h2>Lorem &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ipsum</h2>

¡Hola!

Querido lector,

Este ejercicio está inspirado en un error típico que muchos cometemos cuando empezamos a aprender html. ¡Deseo que te sea de utilidad!

¡Si te ha gustado este contenido te animo a seguirme en mi perfil de empresa de Linkedin!

Francesc Ricart
hola@francescricart.com

Aprender y enseñar. Enseñar y aprender. En el ámbito docente soy docente ocupacional. En el ámbito profesional consultor web. Ofrezco servicios de mejora continua y mantenimiento web. ¿Qué quieres aprender hoy? Encontraréis más acerca de mi en la página sobre mi

No hay comentarios

Escribir un comentario

  Acepto la política de privacidad

Responsable: FRANCESC RICART MUÑOZ.

Finalidad: Gestionar los comentarios que realizas en este blog.

Destinatarios: No se cederán datos a terceros, salvo obligación legal.

Derechos: Tienes derecho a acceder, rectificar y suprimir los datos, así como otros derechos, como se explica en la política de privacidad.