::marker

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimental: Esta es una tecnología experimental
Comprueba la Tabla de compabilidad de navegadores cuidadosamente antes de usarla en producción.

El pseudo-elemento ::marker en CSS selecciona la caja de marcadores de un elemento de la lista, que normalmente contiene una viñeta o un número. Funciona en cualquier elemento o pseudo-elemento configurado para display: list-item, como el elemento <li> y <summary>.

css
::marker {
  color: blue;
  font-size: 1.2em;
}

Propiedades permitidas

Sólo ciertas propiedades CSS puedes utilizarse en una regla con ::marker como selector:

Nota: En la especificación se indica que en el futuro de pueden admitir propiedades CSS adicionales.

Sintaxis

Error: could not find syntax for this item

Ejemplo

HTML

html
<ul>
  <li>Duraznos</li>
  <li>Manzanas</li>
  <li>Ciruelas</li>
</ul>

CSS

css
ul li::marker {
  color: red;
  font-size: 1.5em;
}

Resultado

Especificaciones

Specification
CSS Pseudo-Elements Module Level 4
# marker-pseudo

Compatibilidad con navegadores

BCD tables only load in the browser

Véase también