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

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:

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

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

1
<p>Posso inserire caratteri con i <span>fogli di stile</span></p>
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:

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

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

4 commenti a: “Inserire del testo con i CSS: IE7, un pessimo affare”

  1. 10 giu, 2008 Alex:

    Per non parlare dei selettori di attributo dei css3, con li a[lang="en"] puoi creare link differenti in base alla lingua o cose così…

    RispondiQuota
  2. 10 giu, 2008 Giovambattista Fazioli:

    @Alex: ottima osservazione! Come anche gli pseudo :hover o :focus, anch’essi non completamente supportati da IE. Penso sia una vero peccato non poter mai sfruttare al 100% le potenzialità dei CSS… spriamo che la situazione migliori in un prossimo futuro! :)

    RispondiQuota
  3. 11 giu, 2008 Angelo:

    Si dice che la versione 8 rispetti per buona parte gli elementi css. Speriamo! Spesso mi trovo nella situazione di dover cercare un compromesso del layout in modo da stare bene sia su Firefox e Safari, che su explorer.. A volte mi viene anche la tentazione di lasciar perdere quella baggianata di explorer, e progettare utilizzando pienamente i css..solo che poi ci penso: se non fosse per quel circa 70% di utenti che stanno ancora su Explorer!!

    Complimenti per il blog, ciao a presto!

    RispondiQuota
  4. 11 giu, 2008 Giovambattista Fazioli:

    @Angelo: anche a me viene spesso la stessa “tentazione” ;)

    RispondiQuota

Lascia un commento

TAG XHTML PERMESSI: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> INSERIMENTO CODICE: 
<pre></pre> // blocco generico
					<code></code> // blocco generico
					[cc_actionscript][/cc_actionscript] // Actionscript
					[cc_actionscript3][/cc_actionscript3] // Actionscript 3
					[cc_css][/cc_css] // CSS Style Sheet
					[cc_html][/cc_html] // HTML
					[cc_js][/cc_js] // Javascript
					[cc_objc][/cc_objc] // Objective-C
					[cc_php][/cc_objc] // PHP
					[cc_sql][/cc_sql] // SQL


Stop SOPA