Conditional-CSS: differenziare css in base al browser
Agosto 27th, 2008 by Giovanni Caputo
I Conditional-CSS permettono ai browser di verificare delle condizioni e quindi di attivare o meno alcune proprietà di una classe in base al tipo di browser.
Esempio
.box {
width: 400px;
[if IE 6] width: 600px;
padding: 100px 0;
}
In questo caso se il browser utilizzato è Internet Explorer 6 la larghezza della nostra classe chimata box sarà larga 600 pixel altrimenti 400 pixel
Sintassi Base
[if {!} browser]
[if IE] oppure se è diverso da IE6 [if ! IE]
[if {!} browser version]
[if IE 6] oppure se è diverso da IE6 [if ! IE 6]
[if {!} condition browser version]
[if lt IE 6] oppure se non è Minore di IE6 [if ! lt IE 6]
Browser
- IE – Internet Explorer
- Gecko – Gecko based browsers (Firefox, Camino etc)
- Webkit – Webkit based browsers (Safari, Shiira etc)
- Opera – Opera’s browser
- IEMac – Internet Explorer for the Mac
- Konq – Konqueror
- IEmob – IE mobile
- PSP – Playstation Portable
- NetF – Net Front
Condizioni
- lt – Minore di
- lte – Minore di o Uguale a
- eq – Uguale a
- gte – Maggiore di o Uguale a
- gt – Maggiore di
Per quanto riguarda l’iclusione di fogli di stile su piattaforme server come PHP, C, C# è possibile utilizzare il sito opensource conditional-css.com
Post correlati
Questo post è stato postato mercoledì, Agosto 27th, 2008 at 14:23
nella categoria Programmazione. Tags:css, html, php.
Puoi seguire tutti i commenti di questo articolo attraverso RSS 2.0 feed.
Puoi lasciare un commento, o trackback dal nostro sito.
Agosto 1st, 2010 at 16:14
Articolo di *****.
Magari specificavate che sta cosa funziona solo in PHP e non nei fogli di stile CSS.
Agosto 1st, 2010 at 16:47
In realtà non funziona con PHP, ma sono dei conditional tag per CSS!!!
Marzo 29th, 2011 at 13:58
X anonimo prima di postare cazzate vai a studiare idiota.
I css condizionali lavorano a lato client e sono gestiti dal browser cha si occupa del parsing dell’html della pagina. Inoltre i css condizionali hanno delle specifiche di funzionamento abb chiare a mio avviso e ti basta fare 1 file html e 2-3 css per testarne il funzionamento.
Quindi prima di dire cazzate studia! certo a volte si trovano articoli inutili ma questo non lo è. Anzi è chiaro e ti da dei buoni spunti per testare i css condizionali, quindi mio caro anonimo idiota… prima di dire “merda” taci e studia!
Aprile 2nd, 2011 at 20:09
I css che io ho presentato nell articolo lavorano lato client. Il link finale nell’articolo, invece, presenta una tecnologia particolare; permette di utilizzare css condizionali tramite server. In realtà sono molto diversi dai css condizionali, però potrebbero essere utili e per questi li ho voluti presentare.
Dispiacere aver avuto dei tuoi insulti gratuitamente, però la prossima volta leggi attentamente..
ciao e grazie per il tuo commento
Gennaio 18th, 2012 at 11:45
Proprio quello che cercavo. Non mi andava di replicare un foglio di stile per ogni piattaforma per cambiare un solo parametro! grazie a questo articolo, adesso ho un solo foglio di stile! Thanks!