User Tools

Site Tools


es:web_development:text:format_text

Desarrollo Web Lección 2 - Texto

Dar Formato al Texto

Objetivos

En este ejercicio, aprenderá algunas etiquetas HTML más y cómo usarlas para resaltar secciones de su texto.

Configuración

Continúe usando jsfiddle de la lección anterior. Si lo necesitas de nuevo, aquí lo tienes.

Mi historia
<p>Mi amigo Pablo tiene un perro llamado Sam al que le gusta que le rasquen la barriga. Cuando van al parque, le gusta perseguir una pelota. Se revolca en la tierra, por lo que Pablo tiene que bañarlo cuando llegan a casa.</p>
<p>Los domingos conducen a las montañas donde él corretea oliendo la hierba y moviendo la cola. Se cansa tanto que duerme todo el camino a casa.</p>

Negrita

  • Probemos con otra etiqueta HTML . Agregue <strong> antes de “le gusta perseguir una pelota”. y </strong> después de “le gusta perseguir una pelota”. para que el primer párrafo se vea así.
<p>Mi amigo Pablo tiene un perro llamado Sam al que le gusta que le rasquen la barriga. Cuando van al parque, <strong>le gusta perseguir una pelota</strong>. Se revolca en la tierra, por lo que Pablo tiene que bañarlo cuando llegan a casa.</p>
  • ¿Qué crees que hace <strong>? Se pone el texto entre las etiquetas en negrita.

Cursiva

  • En el segundo párrafo, escribe “perro como mascota” en cursiva.
  • Añadir <em> antes de 'perro' y </em> después de 'mascota'.
<p>Mi amigo Pablo tiene un <em>perro mascota</em> llamado Sam al que le gusta que le rasquen la barriga. Cuando van al parque, <strong>le gusta perseguir una pelota</strong>. Se revolca en la tierra, por lo que Pablo tiene que bañarlo cuando llegan a casa.</p>
  • Haga clic en 'RUN' y verifique el resultado.
  • <em>es la abreviatura de “énfasis” y, de forma predeterminada, pone en cursiva el texto adjunto .

Sobrescrito

  • Sobrescriba la palabra 'montañas' en el segundo párrafo.
  • Añadir <sup> antes de 'montañas' y </sup> después.
<p>Los domingos conducen a las <sup>montañas</sup> donde corretea oliendo la hierba y moviendo la cola. Se cansa tanto que duerme todo el camino a casa.</p>
  • Haga clic en 'RUN' para ver qué hace <sup>.
  • <sup> es la abreviatura de superíndice.
  • <sub> es la abreviatura de subíndice, que pone el texto debajo de la línea. Pruébalo si quieres.

Etiquetas de Anidamiento

  • Es posible aplicar más de una etiqueta al texto. Observe que el par de etiquetas <em> está dentro del par de etiquetas <p>.
  • Podemos hacer lo mismo por em y strong . Pongamos en cursiva la palabra 'pelota'.
<strong>le gusta perseguir una <em>pelota</em></strong>
  • Haga clic en 'RUN' para ver el resultado. La palabra 'pelota' debe estar tanto en negrita como en cursiva.
  • No puede mezclar el orden de las etiquetas. <strong><em></strong></em> es incorrecto. Los resultados serán impredecibles.

Siguiente: Atributos

es/web_development/text/format_text.txt · Last modified: 2023/08/16 09:33 (external edit)