Fumetti con i CSS
Martedì 8 Giugno 2010 - 12:09
di Kiko
Nick Gallagher dà certamente prova di grande abilità e inventiva con questo esperimento. Con un codice HTML semantico e pulito e un uso competente dei CSS è riuscito a creare senza usare immagini e/o script la classica forma del fumetto (speech-bubble o balloon in inglese). Generalmente si usano per richiamare l’attenzione del visitatore su frasi chiave di un prodotto o di un articolo. Se non troppo invasivi possono essere usati per mostrare alcuni blockquote all’interno di un testo.
Qui ne trovate davvero di differenti, per colori e forme, e questo è il foglio CSS esaurientemente commentato.
La base è ottenuta con un uso accorto del contenuto generato (pseudo-elementi :before e :after), gli abbellimenti poggiano invece su alcune proprietà CSS3.
Commenti
1
L’esempio scelto non è il massimo, ma visitanto la collezione completa devo dire che ce ne sono di veramente belli e soprattutto la tecnica utilizzata è molto valida, peccatto che IE7 si comporta come al solito.
2
Io IE non lo tengo più in considerazione. Tre ore per capire cosa non andava in un progetto all’Università. Tre ore per capire, in realtà, che era proprio IE che non andava e non tutto il resto. Per quanto mi riguarda, storia chiusa. O si allineano o si allineano!