El pseudoelemento ::before en CSS se utiliza para insertar contenido antes del contenido de un elemento seleccionado. A menudo se usa con la propiedad “content” para agregar elementos como íconos o marcas antes del contenido real.
Así se utiliza generalmente:
```css
elemento::before {
content: “ “;
/* otras propiedades CSS aquí */
}
```
Puedes utilizar cualquier etiqueta HTML válida en lugar de “elemento”. Por ejemplo, si quieres agregar un ícono antes de cada elemento `
```css
h1::before {
content: url(icon.png);
}
```
En este ejemplo, todos los elementos `
Es importante que la propiedad “content” no esté vacía para que funcione el pseudoelemento ::before. Si no quieres agregar contenido visible, puedes usar un espacio en blanco (” “) o una cadena vacía (“”).
Ten en cuenta que ::before y ::after son pseudoelementos y no se pueden seleccionar o editar como los elementos HTML normales en JavaScript o jQuery. También, no todos los elementos HTML pueden tener pseudoelementos, como los elementos ,
y
Además, según el sitio web Can I Use, el soporte para ::before y ::after es muy amplio, funcionando en todos los navegadores modernos y hasta Internet Explorer 8.
