<mark>: el elemento de resaltado de texto

El Elemento HTML Mark <mark> representa un texto marcadoresaltado como referencia o anotación, debido a su relevancia o importancia en un contexto particular.

Categorías de contenido Contenido de flujo,  contenido de párrafo,  contenido palpable
Contenido permitido Contenido estático
Omisión de etiquetas None, both the starting and ending tag are mandatory.
Elementos padre permitidos Cualquier elemento que acepte contenido estático
Roles ARIA permitidos Cualquiera
Documento normativo HTML 5, sección 4.6.17
DOM interface HTMLElement

Atributos

Este elemento no tiene atributos que no sean los atributos globales, comunes a todos los elementos.

Notas de uso

  • En una cita (<q>)  o en otro bloque (<blockquote>), generalmente indica texto que es de especial interés pero que no está destacado en el material de origen, o material que necesita especial escrutinio, aunque el autor original no lo considerase importante.
  • Por otro lado, <mark> indica una parte del contenido del documento que probablemente sea relevante para el usuario. Por ejemplo, se puede utilizar en una página que muestra los resultados de búsqueda para resaltar cada uno de estos por palabra.
  • No uses el elemento <mark> para resaltado de sintaxis; usa el elemento <span>  para este fin.

No se debe confundir el elemento <mark> con el elemento <strong>. El elemento <strong> se utiliza para denotar intervalos de texto de especial importancia, mientras que el elemento <mark> se utiliza para denotar intervalos de texto de especial relevancia.

Ejemplos

Marcar texto de interés

En este ejemplo, <mark> se utiliza para resaltar texto en una cita que es de particular insterés para el usuario.

<blockquote>
  It is a period of civil war. Rebel spaceships, striking from a
  hidden base, have won their first victory against the evil
  Galactic Empire. During the battle, <mark>Rebel spies managed
  to steal secret plans</mark> to the Empire’s ultimate weapon,
  the DEATH STAR, an armored space station with enough power to
  destroy an entire planet.
</blockquote>

El resultado sería:

Identificando fragmentos sensibles al contexto

Este ejemplo demuestra el uso de <mark> para marcar resultados de búsqueda en el fragmento.

<p>It is a dark time for the Rebellion. Although the Death
Star has been destroyed, <mark class="match">Imperial</mark>
troops have driven the Rebel forces from their hidden base and
pursued them across the galaxy.</p>

<p>Evading the dreaded <mark class="match">Imperial</mark>
Starfleet, a group of freedom fighters led by Luke Skywalker
has established a new secret base on the remote ice world of
Hoth.</p>

Para ayudar a distinguir el uso de <mark> en los resultados de búsqueda de otro uso potencial, este ejemplo aplica la clase "match" a cada coincidencia.

El resultado se vería:

Especificaciones

Specification Status Comment
HTML Living Standard
La definición de '<mark>' en esta especificación.
Living Standard  
HTML5
La definición de '<mark>' en esta especificación.
Recommendation  

Compatibilidad de navegador

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome para AndroidFirefox para AndroidOpera para AndroidSafari en iOSSamsung Internet
markChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo 4IE Soporte completo 9Opera Soporte completo 11Safari Soporte completo SiWebView Android Soporte completo SiChrome Android Soporte completo SiFirefox Android Soporte completo 4Opera Android Soporte completo SiSafari iOS Soporte completo SiSamsung Internet Android Soporte completo Si

Leyenda

Soporte completo  
Soporte completo

Consulta también