Texto en Pequeño en HTML

HTMLHTMLBeginner
Practicar Ahora

💡 Este tutorial está traducido por IA desde la versión en inglés. Para ver la versión original, puedes hacer clic aquí

Introducción

En este laboratorio, aprenderás a usar la etiqueta HTML <small> para cambiar el tamaño del texto. También aprenderás sobre las diferentes maneras de usar la etiqueta <small> y cómo aplicar estilo a ella.

Nota: Puedes practicar la codificación en index.html y aprender Cómo escribir HTML en Visual Studio Code. Haga clic en 'Go Live' en la esquina inferior derecha para ejecutar el servicio web en el puerto 8080. Luego, puede actualizar la pestaña Web 8080 para previsualizar la página web.


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL html(("HTML")) -.-> html/TextContentandFormattingGroup(["Text Content and Formatting"]) html(("HTML")) -.-> html/AdvancedElementsGroup(["Advanced Elements"]) html(("HTML")) -.-> html/BasicStructureGroup(["Basic Structure"]) html/BasicStructureGroup -.-> html/basic_elems("Basic Elements") html/BasicStructureGroup -.-> html/head_elems("Head Elements") html/TextContentandFormattingGroup -.-> html/text_head("Text and Headings") html/TextContentandFormattingGroup -.-> html/para_br("Paragraphs and Line Breaks") html/AdvancedElementsGroup -.-> html/inter_elems("Interactive and Dynamic Elements") subgraph Lab Skills html/basic_elems -.-> lab-70835{{"Texto en Pequeño en HTML"}} html/head_elems -.-> lab-70835{{"Texto en Pequeño en HTML"}} html/text_head -.-> lab-70835{{"Texto en Pequeño en HTML"}} html/para_br -.-> lab-70835{{"Texto en Pequeño en HTML"}} html/inter_elems -.-> lab-70835{{"Texto en Pequeño en HTML"}} end

Agrega estructura a tu archivo

Crea un archivo HTML llamado index.html en tu editor de texto.

Agrega la plantilla HTML a tu archivo. Luego, crea una etiqueta <body> y agrega el siguiente código dentro de ella:

<h1>Usando la etiqueta small de HTML</h1>
<p>Este es un texto que queremos hacer más pequeño:</p>

Agrega la etiqueta small

Agrega la etiqueta <small> dentro de la etiqueta <p>, y agrega un poco de texto entre las etiquetas de apertura y cierre:

<p>Este es un texto que queremos hacer <small>más pequeño</small>:</p>

Agrega texto legal utilizando la etiqueta <small> copiando y pegando el siguiente código dentro de la etiqueta <body>:

<p>
  Este es solo un texto regular, pero aquí hay un <small>texto legal</small>:
</p>
<small
  >Esta página web no es responsable de ninguna información errónea o errores.
  Lea con cuidado antes de confiar en esta página web.</small
>

Aplica estilo a la etiqueta small

Aplica un poco de estilo a la etiqueta <small> agregando el siguiente código dentro de la etiqueta <head>:

<style>
  small {
    font-size: smaller;
    color: red;
  }
</style>

Agrega la etiqueta small para comentarios laterales

Agrega un comentario lateral utilizando la etiqueta <small> copiando y pegando el siguiente código dentro de la etiqueta <body>:

<p>
  Este es solo un texto, pero aquí hay un
  <small>comentario lateral</small> sobre este texto:
</p>

Guarda tus cambios en el archivo index.html y dile a un navegador web que los abra. Deberías ver los cambios que hiciste a la etiqueta <small>.

Resumen

En este laboratorio, aprendiste cómo usar la etiqueta HTML <small> para cambiar el tamaño del texto y cómo aplicar estilo a ella. También aprendiste sobre las diferentes maneras de usar la etiqueta <small>, incluyendo para texto legal, comentarios laterales y notas a pie de página. Ahora puedes usar la etiqueta <small> para agregar énfasis a tu texto y que destaque.