Il pseudo-elemento `::before` in CSS viene utilizzato per inserire contenuto prima di un elemento selezionato. L’elemento inserito è inserito come primo figlio dell’elemento selezionato.
Ecco un esempio di utilizzo:
```
p::before {
content: “Leggi: “;
color: red;
}
```
In questo esempio, la parola “Leggi: “ è inserita prima di ogni paragrafo (p) e colorata in rosso. La proprietà `content` è utilizzata per specificare cosa inserire.
Si noti che dovrai sempre definire la proprietà `content`, anche se è solo vuota, altrimenti l’elemento `::before` non verrà visualizzato.
Inoltre, gli pseudo-elementi ::before e ::after sono inline di default. Puoi cambiarli in block o inline-block se necessario, in base al layout che stai cercando di raggiungere.
```
p::before {
content: “Leggi: “;
color: red;
display: block;
}
```
In questo esempio, ogni “Leggi: “ sarà su una nuova riga perché è definito come un blocco.
