Dominando el texto enfatizado en HTML

Introducción

La etiqueta  en HTML se utiliza para agregar énfasis o importancia a un texto específico en una página web. Es muy útil para resaltar contenido específico y hacerlo más notorio. En este laboratorio, aprenderás cómo usar la etiqueta  en HTML y su sintaxis básica.

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/BasicStructureGroup(["Basic Structure"]) html(("HTML")) -.-> html/TextContentandFormattingGroup(["Text Content and Formatting"]) html(("HTML")) -.-> html/LayoutandSectioningGroup(["Layout and Sectioning"]) html(("HTML")) -.-> html/AdvancedElementsGroup(["Advanced Elements"]) 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/LayoutandSectioningGroup -.-> html/nav_links("Navigation and Links") html/LayoutandSectioningGroup -.-> html/doc_flow("Document Flow Understanding") html/AdvancedElementsGroup -.-> html/inter_elems("Interactive and Dynamic Elements") subgraph Lab Skills html/basic_elems -.-> lab-70749{{"Texto enfatizado en HTML"}} html/head_elems -.-> lab-70749{{"Texto enfatizado en HTML"}} html/text_head -.-> lab-70749{{"Texto enfatizado en HTML"}} html/para_br -.-> lab-70749{{"Texto enfatizado en HTML"}} html/nav_links -.-> lab-70749{{"Texto enfatizado en HTML"}} html/doc_flow -.-> lab-70749{{"Texto enfatizado en HTML"}} html/inter_elems -.-> lab-70749{{"Texto enfatizado en HTML"}} end

Agregando un encabezado

Primero, crea un archivo HTML llamado index.html y dile a tu editor de código preferido que lo abra.

Comencemos agregando un encabezado de título a nuestro archivo HTML. Escribe el siguiente código en tu archivo index.html.

<!doctype html>
<html>
  <head>
    <title>HTML Em Tag Lab</title>
  </head>
  <body></body>
</html>

Usando la etiqueta `` de HTML

Ahora que hemos creado nuestro archivo HTML, es hora de usar la etiqueta . En los siguientes pasos, aprenderemos cómo usar esta etiqueta y su sintaxis básica.

Comienza agregando un párrafo corto a tu archivo HTML y usa la etiqueta  para enfatizar una palabra específica. Aquí hay un ejemplo:

<p>HTML <em>Enfatizado</em> texto es importante para tu página web.</p>

Agregando más texto enfatizado

También puedes usar la etiqueta  para enfatizar múltiples palabras en una oración. Aquí hay un ejemplo:

<p><em>HTML</em> significa <em>HyperText Markup Language.</em></p>

Usando CSS para dar estilo a la etiqueta `` de HTML

Por defecto, el texto enfatizado se muestra en cursiva. Sin embargo, también puedes usar CSS para personalizar el estilo de la etiqueta . Aquí hay un ejemplo:

<style>
  em {
    font-style: normal;
    font-weight: bold;
  }
</style>
<p><em>CSS es</em> utilizado para dar estilo a las páginas web HTML.</p>

Agregando un enlace

También puedes usar la etiqueta  dentro de un enlace, para enfatizar el texto del ancla. Aquí hay un ejemplo:

<a href="https://www.wikipedia.org"
  ><em>Wikipedia</em> es una enciclopedia en línea gratuita.</a
>

Resumen

¡Felicidades! En este laboratorio, aprendiste sobre la etiqueta  de HTML y cómo usarla para agregar énfasis o importancia al texto en una página web. También aprendiste cómo personalizar el estilo de la etiqueta  usando CSS. Sigue practicando para convertirse en un maestro de las etiquetas y elementos de HTML.

Texto enfatizado en HTML

Introducción

Skills Graph

Agregando un encabezado

Usando la etiqueta `<em>` de HTML

Agregando más texto enfatizado

Usando CSS para dar estilo a la etiqueta `<em>` de HTML

Agregando un enlace

Resumen

Texto enfatizado en HTML

Introducción

Skills Graph

Agregando un encabezado

Usando la etiqueta <em> de HTML

Agregando más texto enfatizado

Usando CSS para dar estilo a la etiqueta <em> de HTML

Agregando un enlace

Resumen

Usando la etiqueta `<em>` de HTML

Usando CSS para dar estilo a la etiqueta `<em>` de HTML