Etiqueta em en HTML
¿Qué es la etiqueta <em> en HTML?
La etiqueta HTML <em> se utiliza para enfatizar el texto en una página web. El texto enfatizado se puede mostrar en cursiva o en negrita, dependiendo del estilo de la página web.
La etiqueta <em> es similar a la etiqueta <strong>, pero se utiliza para enfatizar el texto en lugar de para hacerlo más importante o destacado. El texto enfatizado puede indicar que es importante o que se debe prestar atención a él.
La etiqueta <em> se puede utilizar en combinación con otros elementos, como <p>, <span> o <div>, para enfatizar una parte del texto. También se puede utilizar en combinación con otras etiquetas de formato, como <b> o <i>, para aplicar estilos de formato específicos al texto enfatizado.
Ejemplo de uso
Aquí te presento un ejemplo sencillo de cómo se puede utilizar la etiqueta <em> en HTML5:
<p>El plazo para enviar la solicitud de empleo es <em>mañana</em>.</p>
Lenguaje del código: HTML, XML (xml)En este ejemplo, hemos utilizado la etiqueta <em> para enfatizar la palabra “mañana” en el texto. Esto indica que la fecha límite para enviar la solicitud de empleo es importante y que se debe prestar atención a ella. El texto enfatizado se puede mostrar en cursiva o en negrita dependiendo del estilo de la página web.
Además de la etiqueta <em>, también existe la etiqueta <i> que se utiliza para enfatizar el texto en un contexto diferente, principalmente para resaltar el texto como diferente, sin necesariamente enfatizar su importancia.
Atributos
La etiqueta HTML <em> no admite muchos atributos, ya que se utiliza principalmente para enfatizar el texto en una página web. Los atributos principales que admite son los siguientes:
- class: este atributo se utiliza para aplicar estilos CSS a la etiqueta <em> y para agrupar varias etiquetas con el mismo estilo.
- id: este atributo se utiliza para identificar la etiqueta en el documento y puede ser útil para aplicar estilos CSS o para acceder a la etiqueta mediante JavaScript.
Además de estos atributos, la etiqueta <em> también admite otros atributos opcionales, como “lang” y “dir”, que se utilizan para especificar el idioma y la dirección de escritura del texto enfatizado.
Ejemplo:
Aquí te presento un ejemplo de cómo se puede utilizar el atributo “class” en la etiqueta <em>:
<p>Este párrafo contiene <em class="destacado">texto enfatizado</em> que se muestra con un estilo personalizado en CSS.</p>
Lenguaje del código: HTML, XML (xml)En este ejemplo, hemos utilizado la etiqueta <em> para enfatizar el texto “texto enfatizado” y hemos utilizado el atributo “class” para aplicar un estilo personalizado a la etiqueta. En la regla CSS definida, hemos aplicado un estilo de fuente en cursiva y un color rojo oscuro al texto enfatizado.
Más ejemplos
Aquí te presento dos ejemplos completos y avanzados de la etiqueta <em> de HTML5:
Ejemplo 1: Utilizando la etiqueta <em> para enfatizar el texto y la etiqueta <strong> para destacar la importancia.
<!DOCTYPE html>
<html>
<head>
<title>Ejemplo de etiqueta em y strong</title>
</head>
<body>
<p>Es <strong>importante</strong> que envíes la solicitud de empleo <em>antes de la fecha límite</em>.</p>
</body>
</html>
Lenguaje del código: HTML, XML (xml)En este ejemplo, hemos utilizado la etiqueta <strong> para destacar la importancia del texto “importante” y hemos utilizado la etiqueta <em> para enfatizar el texto “antes de la fecha límite”.
De esta manera, estamos indicando que es importante enviar la solicitud de empleo antes de la fecha límite y que este hecho se debe prestar atención.
Ejemplo 2: Utilizando la etiqueta <em> dentro de un enlace <a> para enfatizar el texto.
<!DOCTYPE html>
<html>
<head>
<title>Ejemplo de etiqueta em en un enlace</title>
</head>
<body>
<p>Para obtener más información, visite nuestro sitio web <a href="https://www.ejemplo.com"><em>pulsando aquí</em></a>.</p>
</body>
</html>
Lenguaje del código: HTML, XML (xml)En este ejemplo, hemos utilizado la etiqueta <em> dentro de un enlace <a> para enfatizar el texto “pulsando aquí”.
Esto indica al usuario que puede obtener más información al hacer clic en el enlace. Al hacer clic en el enlace, se abrirá el sitio web especificado en el atributo “href”.