Optimisation CSS 2-(Résumé de la syntaxe des abréviations CSS communes)_Échange d'expérience

L'utilisation d'abréviations peut aider à réduire la taille de vos fichiers CSS et à les rendre plus faciles à lire. Les principales règles pour l'abréviation CSS sont les suivantes :

Color
Valeur de couleur hexadécimale, si la valeur de chacun des deux chiffres est la même, elle peut être abrégée de moitié, par exemple :
#000000 peut être abrégé en #000;# 336699 peut être abrégé en #369;

Taille de la boîte
a généralement les quatre méthodes d'écriture suivantes :

property:value1; une valeur valeur1 ;
propriété : valeur1 valeur2 ; signifie que la valeur du haut et du bas est valeur1, la valeur de droite et de gauche est valeur2
propriété : valeur1 valeur2 valeur3 ; droite et gauche sont valeur2, et la valeur du bas est valeur3
property:value1 value2 value3 value4; Les quatre valeurs représentent tour à tour haut, droite, bas, gauche
La façon pratique de se souvenir est dans le sens des aiguilles d'une montre, en haut , droite, bas, gauche. Des exemples d'applications spécifiques en marge et en remplissage sont les suivants :
margin:1em 0 2em 0.5em

Border (border)
Les propriétés de la bordure sont les suivantes :
border-width:1px ;
border-style:solid
border-color:#000;
peut être abrégé en une phrase : border:1px solid #000; la syntaxe est border:width style color;

Arrière-plans
Les propriétés de background sont les suivantes :

background-color:#f00;background-image:url(background. gif);
background-repeat :no-repeat;
background-attachment:fixed
background-position:0 0; peut être abrégé en une phrase : background:#f00 url(background) .gif) no-repeat fixed 0 0;

La syntaxe est background:color image repeat attachment position

Vous pouvez omettre une ou plusieurs valeurs d'attribut. En cas d'omission, la valeur de l'attribut sera utilisée. la valeur par défaut du navigateur. La valeur par défaut est :

couleur : transparent
image : aucune
répéter : répéter
pièce jointe : défilement
position : 0% 0%
Polices (polices)
Les attributs de la police sont les suivants :

font-style:italic;
font-variant:small-caps; font-size:1em;
line-height:140% ;
font-family:"Lucida Grande",sans-serif
peut être abrégé en une phrase : font:italic small-caps bold 1em; /140% "Lucida Grande",sans-serif;

Notez que si vous abrégez la définition de la police, vous devez définir au moins deux valeurs : font-size et font-family.

Listes
Pour annuler les points et les numéros de série par défaut, vous pouvez écrire list-style:none;,

les attributs de liste sont les suivants :

list-style -type:square;
list-style-position:inside;
list-style-image:url(image.gif)
peut être abrégé en une phrase : list-style:square inside url(); image.gif);