Atributo content de CSS

Definición y uso

El atributo content se utiliza junto con los pseudo-elementos :before y :after para insertar contenido generado.

Explicación

Esta propiedad se utiliza para definir el contenido generado que se coloca antes o después del elemento. Por defecto, este contenido es a menudo contenido en línea, aunque el tipo de cuadro creado por este contenido se puede controlar con el atributo display.

Véase también:

Manual de referencia de CSS:Elemento pseudo :before de CSS

Manual de referencia de CSS:Elemento pseudo :after de CSS

Manual de referencia del DOM HTML:Atributo content

Ejemplo

El siguiente ejemplo inserta en cada enlace los corchetes con la URL:

a:after
  {
  content: " (" attr(href) ")";
  }

Prueba tu mismo

Sintaxis de CSS

content: normal|none|counter|attr|cadena|open-quote|close-quote|no-open-quote|no-close-quote|url|initial|inherit;

Valor del atributo

Valor Descripción
none 　
normal 　
especificaciones de content 　
inherit Se especifica que debe heredarse el valor de la propiedad content del elemento padre.

Detalles técnicos

Valor por defecto: normal
Herencia: no
Versión: CSS2
Sintaxis de JavaScript: object.style.content="url(beep.wav)"

Compatibilidad del navegador

Los números en la tabla indican la primera versión del navegador que admite completamente esta propiedad.

Chrome IE / Edge Firefox Safari Opera
1.0 8.0 1.0 1.0 4.0