Inserire del testo con i CSS: IE7, un pessimo affare

Martedì 10 Giugno, 2008

Ancora una volta, quando mi trovo a scrivere riguardo le capacità dei fogli di stile, sono costretto a porre in disparte Microsoft Internet Explorer! Con i CSS2 è stata introdotta una caratteristica davvero interessante, la proprietà content, usata in congiunzione con gli pseudo-elementi before e after. Tramite questo “stile” è possibile alterare il contenuto di un sito agendo esclusivamente sul file CSS. Ad esempio se scriviamo:

CSS:
  1. li:before { content: ">>" }

Un elenco puntato (UL, LI) avrà ogni elemento preceduto dai caratteri “>>”! Qualsiasi elemento, ovviamente, può essere trattato in questo modo:

HTML:
  1. <p>Posso inserire caratteri con i <span>fogli di stile</span></p>

CSS:
  1. p span:before { content: "-->" }

La versatilità di questo elemento non finisce qui! È infatti possibile utilizzare altri parametri oltre al semplice (ma utilissimo) testo. L’elemento content, infatti, permette anche valori speciali o url:

CSS:
  1. p:before { content: url(images/quote.gif) }
  2. p:after { content: close-quote }
  3. p:before { content: url(waves/sound.wav) }

Per i dettagli sull’implementazione fare riferimento direttamente a W3C – peccato non lo faccia anche Microsoft!

Post correlati