Modulo 3 Trabajo con texto

 

Módulo 3: Trabajo con texto


En esta lección aprenderás cómo dar formato al texto en HTML y cómo crear diferentes tipos de listas para organizar la información.


Formato básico de texto

Negritas: <b> y <strong>

Ambas etiquetas ponen el texto en negrita, pero <strong> indica además que el texto tiene importancia semántica.

<b>Texto en negrita</b>
<strong>Texto importante</strong>

Cursivas: <i> y <em>

Ambas etiquetas ponen el texto en cursiva, pero <em> indica que el texto está enfatizado.

<i>Texto en cursiva</i>
<em>Texto enfatizado</em>

Subrayado: <u>

La etiqueta <u> subraya el texto.

<u>Texto subrayado</u>

Otras etiquetas de formato

  • <small> – texto más pequeño
  • <mark> – texto resaltado
  • <sup> – superíndice
  • <sub> – subíndice
Texto normal <small>(más pequeño)</small>
<mark>Texto resaltado</mark>
H2O (superíndice)
CO2 (subíndice)

Listas en HTML

Listas ordenadas (<ol>)

Se usan para elementos con un orden específico.

<ol>
<li>Primero</li>
<li>Segundo</li>
</ol>

Listas desordenadas (<ul>)

Se usan para listas sin orden específico (con viñetas).

<ul>
<li>Manzana</li>
<li>Banana</li>
</ul>

Listas de definición (<dl>)

Sirven para términos y sus descripciones.

<dl>
<dt>HTML</dt>
<dd>Lenguaje de marcado para la web</dd>
<dt>CSS</dt>
<dd>Hojas de estilo en cascada</dd>
</dl>

Preguntas de Repaso

Pregunta 1

¿Qué etiqueta indica importancia semántica además de poner el texto en negrita?

  • A) <b>
  • B) <i>
  • C) <u>
  • D) <strong>

Pregunta 2

¿Qué etiqueta se utiliza para enfatizar texto?

  • A) <i>
  • B) <em>
  • C) <mark>
  • D) <small>

Pregunta 3

¿Qué tipo de lista usa números para enumerar los elementos?

  • A) <ul>
  • B) <ol>
  • C) <dl>
  • D) <li>

Pregunta 4

¿Qué etiqueta se usa para resaltar texto?

  • A) <mark>
  • B) <strong>
  • C) <em>
  • D) <u>

Pregunta 5

¿Qué estructura HTML asocia términos y definiciones?

  • A) <ul>
  • B) <ol>
  • C) <dl>
  • D) <li>

Esta lección forma parte del curso básico de HTML. En la siguiente, aprenderás a trabajar con enlaces e imágenes.

No hay comentarios:

Publicar un comentario

Políticas de Privacidad