Feuille de style CSS conditionnelle avec Conditional CSS

Rigueur. Et passion !

Ne dites pas à ma mère que je suis artisan en architecture de l'information appliquée aux sites web : elle croit que je suis webdesigner, intégrateur HTML & CSS, rédacteur web, formateur NTIC et consultant en webmarketing depuis 2001 ! Voulez-vous en savoir plus ?

Le blog de l'intégrateur web

Feuille de style CSS conditionnelle avec Conditional CSS

Conditional-CSS est un programme écrit en php4 et php5 (au choix) qui permet d’utiliser des commentaires pour cibler une dizaine de navigateurs par leur nom et leur version, à la manière des commentaires conditionnels ciblant les différentes versions d’Internet Explorer.

Les commentaires conditionnels de Conditional-CSS peuvent s’appliquer à l’ensemble d’une règle CSS ou à une seule de ses propriétés. Voici un exemple d’utilisation :

/* Conditional-CSS example */
a.button_active, a.button_unactive {
    display: inline-block;
    [if lte Gecko 1.8] display: -moz-inline-stack;
    [if lte Konq 3.1] float: left;
    height: 30px;
    [if IE 5.0] margin-top: -1px;
    text-decoration: none;
    outline: none;
    [if IE] text-decoration: expression(hideFocus='true');
}

Voici les navigateurs pris en charge par le script :

  • Internet Explorer
  • Internet Explorer Mac
  • Gecko (Firefox etc)
  • Webkit (Safari etc)
  • Opera
  • Konqueror
  • Safari Mobile (iPhone, iPod)
  • IE Mobile
  • PSP Web browser

Même si je ne suis pas fan de ce genre de technique — qui automatise d’une certaine manière les hacks CSS souvent décriés — force est de reconnaitre que l’auteur de c-css à fait du beau travail. Je garde l’adresse sous le tapis de souris : on ne sait jamais ;)

Articles sur le même sujet

PS : Le respect de la vie privée sur internet est important : j'ai décidé d'échanger mon bouton Like de Facebook par un bouton Faire un don de Paypal car
Il n'y pas d'amour, il n'y a que des preuves d'amour (Jean Cocteau) ;) Merci d'avance.



10 commentaires pour “Feuille de style CSS conditionnelle avec Conditional CSS”

  1. Nicolas F. dit :

    Pas fan non-plus des solutions qui passent par PHP et qui sont donc gourmandes en ressources. Surtout que les progrès des navigateurs me laissent espérer que ces hacks ne seront plus aussi présent dans un avenir proche. Enfin, espérons-le !

  2. Don-16ar dit :

    En effet, très pratique mais plutôt gourmand … Merci pour l’astuce en tout les cas…..

  3. Florent V. dit :

    Les deux inconvénients majeurs sont les suivants:

    c’est du browser sniffing, avec toutes les limites que l’on connait; il y a un impact non négligeable sur les performances à partir du moment où le CSS est généré par PHP.

    Je ne suis pas sûr que ça vaille le coup.

  4. Icarius dit :

    Même si c’est dépassé, ça reste très intéréssant.

  5. travel dit :

    Excellent!

  6. Pulk dit :

    Il est clair que cela pose des inconvénients au niveau des performances et franchement, j’ai du mal à voir l’utilité d’un tel soft.

  7. Martin dit :

    Je ne suis pas fan non plus de telles techniques, qui ont leur limites évidentes. Il est très largement plus pertinent de faire une unique feuille de styles pour l’ensemble des navigateurs. Et c’est là que se situe la difficulté : faire générique là où les navigateurs ne le sont pas.

  8. mutuelle dit :

    reponse a florent , c est depassé par quoi ?

  9. mutuelle dit :

    Merci pour l’astuce,Excellent!

  10. mutuelle dit :

    Voila une information précise et utile !

Laissez un commentaire

Vous pouvez utiliser les balises HTML suivantes : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Les commentaires sont publiés sous votre pleine et entière responsabilité et ne doivent pas contrevenir aux lois et règlementations en vigueur. Les propos racistes ou antisémites, diffamatoire ou injurieux, divulguant des informations fausses, relatives à la vie privée d'une personne ou utilisant des oeuvres protégées par les droits d'auteurs ne sont pas les bienvenus et seront modérés sans modération.

Merci d'être constructif et n'oubliez pas : « sans la liberté de ramer il n'est point d'éloge flotteur ! »



Colophon

CSS & Webdesign est une publication irrégulomadaire à tendance hebdomadaire
éditée par Bruno Bichet qui carbure à WordPress et au café équitable.
Tous droits réservés © 2006 - 2011.

Contactez l'auteur du site