[CSS Note 8] Abréviation du code CSS, occupant moins de bande passante

1. Abréviation du code du modèle de boîte
N'oubliez pas que lorsque vous parlez du modèle de boîte, les marges, le remplissage et les bordures sont définis dans les quatre directions du haut, du bas, de la gauche et de la droite dans le sens des aiguilles d'une montre. Définir : en haut à droite, en bas à gauche. Des exemples d'applications spécifiques en marge et en remplissage sont les suivants :

margin:10px 15px 12px 14px;/*上设置为10px、右设置为15px、下设置为12px、左设置为14px*/

a généralement les trois abréviations suivantes :

Si les valeurs haut, droite, bas. , et left sont identiques, Par exemple, le code suivant :

margin:10px 10px 10px 10px;

peut être abrégé en :

margin:10px;

2. Si les valeurs de top et en bas sont les mêmes, les valeurs de gauche et de droite sont les mêmes, comme dans le code suivant :

margin:10px 20px 10px 20px;

peut être abrégé en :

margin:10px 20px;

3. Si les valeurs de gauche et de droite sont les mêmes, comme dans le code suivant :

margin:10px 20px 30px 20px;

peut être abrégé en :

margin:10px 20px 30px;

Remarque : les méthodes d'abréviation de padding et de border sont les mêmes que celles de margin.

2. Abréviation de la valeur de couleur
Le style CSS de couleur peut également être abrégé lorsque la couleur que vous définissez est une valeur de couleur hexadécimale, si les valeurs de chacun des deux chiffres sont les mêmes. , vous pouvez Abréviation moitié.

Exemple 1 :

p{color:#000000;}
可以缩写为：
p{color: #000;}
例子2：
p{color: #336699;}
可以缩写为：
p{color: #369;}

3. Abréviation de police
Le code de style CSS de police dans la page Web a également sa propre abréviation. Voici le code pour définir la police. la page Web :

body{ font-style:italic; font-variant:small-caps; font-weight:bold; font-size:12px; line-height:1.5em; font-family:"宋体",sans-serif; }

Tant de lignes de code peuvent en fait être abrégées en une seule phrase :

body{ font:italic small-caps bold 12px/1.5em "宋体",sans-serif; }

Remarque :

1 . En utilisant cette abréviation, vous devez au moins Pour spécifier les propriétés font-size et font-family, d'autres propriétés (telles que font-weight, font-style, font-varient, line-height) utiliseront automatiquement la valeur par défaut si ce n'est pas le cas. spécifié.

2. Lorsque vous abrégez, ajoutez "/" en diagonale entre la taille de la police et la hauteur de la ligne.

En général, comme il y a encore relativement peu d'anglais pour les sites Web chinois, les codes d'abréviation suivants sont plus couramment utilisés :

body{ font:12px/1.5em "宋体",sans-serif; }

Il n'a que la taille de la police, l'espacement des lignes, la police chinoise et Paramètres de police anglais.

Ce qui précède est l'abréviation du code CSS [CSS Note 8], qui consomme moins de bande passante. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !