Espacios en blanco HTML. Practicando con caracteres especiales.

Espacios en blanco HTML. Practicando con caracteres especiales.

Print Friendly, PDF & Email
Espacios en blanco HTML. Practicando con caracteres especiales.
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!

Entradas relacionadas:

Cuidado con los tutoriales pdf obsoletos sobre html, css y javascript
- 120
En internet se encuentra mucho material de gran calidad para aprender lenguajes como html, css, y javascript. ¿Pero todos los pdf sirven?
¿Se pueden hacer listas númeradas negativas con HTML?
- 71
Ejemplos de listas numeradas negativas. Incluye código e imágenes del resultado final con distintas opciones.
Como usar los encabezados h1 a h6 en html
- 434
Una duda frecuente cuando nos iniciamos en el mundo del html es saber cuando debemos usar un h1, un h2, un h3 o hasta un h4. En esta entrada miramos de dar un criterio lógico que pueda servir de ayuda...
Libro digital navegable
- 153
Ejercicio html en el que se practican los conceptos de listas anidadas ul, ol , li , anclas, enlaces, link y url relativas. Incluye solución. ¡Tu primer libro digital con html!
Mapas de imagen en html
- 541
Los mapas de imágenes son una funcionalidad HTML para las imágenes muy curiosa que permiten definir diferentes enlaces asociados a distintas zonas de una misma imagen. A pesar de haber caído en desuso...
Practicando con listas ordenadas y listas no ordenadas | Ejercicio html
- 106
Ejercicios html sobre listas ordenadas y listas no ordenadas y el uso de los atributos que pueden acompañar una lista. Inlcuye solución.
Validadores de código HTML y CSS
- 640
Incluso los programadores y diseñadores más experimentados cometen errores de sintaxis o vocabulario picando código en lenguaje html, css, javascript y cualquier otro lenguaje de programación. Nos pas...
Como anidar etiquetas html correctamente
- 77
Un error típico en muchos alumnos de web es no anidar bien las etiquetas. Te resumo como hacerlo y dónde se suele equivocar la gente.
Códigos HTML | Carácteres especiales (escapados)
- 133
¿Por qué se escapan los caracteres en html? ¿Que utilidad tiene complicarse con símbolos estraños? ¿Como los usamos? Apuntes de alumno HTML.
Imágenes en html: la etiqueta img
- 583
Hoy en día se nos hace difícil imaginar aquellas primeras páginas web sin imágenes. La etiqueta de html se propuso por primera vez en 1993 por Marc Andreessen. En esta entrada presentamos la etiqueta...
Francesc Ricart
hola@francescricart.com

Soy un ingeniero industrial a quién le apasiona aprender y enseñar. En el mundo del marketing online he encontrado una de mis pasiones. Ejerzo como docente ocupacional y privado para empresas. Y también hago consultoría web para PIMES, autónomos y otros emprendedores como yo. Ayudo a las empresas en cualquier temática relacionada con su presencia digital y herramientas web. Aunque mi especialidad es el posicionamiento en buscadores (SEO). A nivel de formación lo que más feliz me hace es que un alumno haga de mi pasión una forma de vida y le ayude a encontrar trabajo. A nivel de negocios ayudo a empresarios a desenvolverse con soltura en el mundo digital y les animo a hacer cada vez más cosas que nunca hubieran imaginado que ellos también podían hacer. En este camino les ayudo haciendo todo aquello dónde ellos no llegan y crecemos juntos. 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.