picture picture
juin 7, 2006 CSS 4 Commentaires

Raccourcis et abréviations des styles CSS

certains caractères peuvent être utilisés pour préciser une sélection, et certaines règles peuvent être raccourcies…

L’utilisation de CSS est des plus faciles et logiques, mais certains caractères peuvent être utilisés pour préciser une sélection, et certaines règles peuvent être raccourcies. Elles permettent aux développeurs d’être plus efficaces, mais dans un Web où l’apprentissage par la lecture de la source fait encore foi, nombreux sont ceux qui peuvent être perdus par de tels usages.
Voici donc quelques-unes de ces optimisations de CSS, par l’exemple :

:)) p>i { règles }
C’est un précision de sélection : les règles ici s’appliquent à tous les éléments <i> se trouvant à l’intérieur d’un élément <p>. Dans le cas d’une sélection html>p, les règles s’appliquent à tous les éléments <p> du document…

:)) p+h1 { règles }
Précision de sélection : les règles s’appliquent à tout élément <h1> précédé immédiatement d’un élément <p>.

:)) p { font: bold 11px/1.5 Verdana, sans-serif; }
C’est un raccourci : la règle ci-dessus est une version écourtée des règles suivantes :
font-weight: bold;
font-size: 11px;
line-height: 1.5;
font-family: Verdana, sans-serif;

:)) .contenu { color: #653; }
Un raccourci pour les couleurs web-safe : cette règle correspond à la règle
color: #665533;

:)) #titre { margin: 2px 0; padding: 2px; }
Les règles margin et padding sont normalement de cette forme
margin: 2px 3px 0 5px
padding: 0 0 0 3px
Les règles ci-dessus sont des versions raccourcies de
margin: 2px 0 2px 0;
padding: 2px 2px 2px 2px;

source

4 Responses to “Raccourcis et abréviations des styles CSS”

4 Commentaires

  1. JDN viewer dit :

    Ce texte est un excellent copier coller d’un article paru sur le Journal du Net le 10/11/2004. Voici le lien : http://developpeur.journaldunet.com/tutoriel/css/041109-css-optimisations-raccourcis.shtml

    =======

    Note de webtolosa : pas tout à fait un copier -coller … mais source citée en fin de post :)
    avec chaudes recommandations pour le site du journal du net

  2. webtolosa dit :

    alors ced, on fait joujou avec les smileys ? ;)

  3. ced dit :

    :no: :no: :no: :p 0) 0) 0)

  4. ced dit :

    oui c vrai zzz zzz zzz zzz

Commentaire

Name

Mail (ne sera pas publié)

Website

Laisser ces deux champs tels quels :
:D :-) :( :o 8O :? 8) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: