Couleur et unité des attributs communs CSS

Dans l'écriture de code CSS, l'estimation des couleurs et des unités est essentielle. Cependant, il existe de nombreuses façons d'écrire les couleurs et les valeurs unitaires​​en CSS, il est donc nécessaire de le clarifier.

Couleur

Quand j'apprenais tout juste le front-end, une question s'est posée : "Comment dois-je définir ça marche ? Couleur de la page Web ?" Les noms de couleurs anglais ou les valeurs de couleur hexadécimales sont généralement utilisés pour définir les couleurs, mais il existe d'autres méthodes d'écriture
plus compliquées en CSS.

Couleur RVB

L'ordinateur génère de nouvelles couleurs à travers différents niveaux de rouge, vert et bleu, souvent appelés couleurs RVB. . Avec un tel mécanisme de génération de couleurs, vous pouvez déterminer la couleur en donnant directement différents niveaux de couleur, et vous pouvez
combiner vous-même les valeurs des trois couleurs.

Méthode d'écriture :
h1{color:rgb(100%,100%,100%)} Méthode d'écriture de couleur RVB en pourcentage, la plage de nombres est de 0% à 100%
h1{color:rgb(0,255,255)} Méthode d'écriture des couleurs RVB, la plage de nombres est de 0 à 255

Remarque : Les valeurs​​des deux méthodes d'écriture seront tronquées, le pourcentage sera tronqué à 0 %-100 %, c'est-à-dire que s'il dépasse 100 %, il sera tronqué à 100 %, s'il est inférieur à 0 %, il sera réduit à 0 % et le nombre sera réduit à 0-255. De plus, les deux ne peuvent pas être mélangés. L'écriture mixte ne prendra pas effet.

Nous ne mentionnerons plus la couleur hexadécimale et la couleur de réglage du nom de la couleur

Unité

Unités de longueur : généralement divisées en unités absolues et unités relatives. Les unités absolues ont été rarement utilisées depuis leur naissance, du moins je les utilise rarement dans des projets. Par conséquent, l’introduction des unités absolues est ignorée ici.

Unités relatives : Il existe trois unités de longueur relative, em, ex et px. Les deux premiers représentent respectivement "la hauteur de la police de l'élément" et "la hauteur de la lettre shezhi'x'". Ce sont des mesures en impression ordinaire. Le dernier px représente les "pixels". 🎜> Relatif car il dépend de la résolution de l'écran.

em : En CSS, un "em" est la valeur de taille de police d'une police donnée. La seule exception concerne la définition de la taille de la police, auquel cas la valeur em est relative à l'élément parent.

tels que

• corps{font-size:20px;}

• p{font-size:1em;}

À l'heure actuelle, la taille de la police de p est de 20 px , pas le 16px par défaut.

px : Défini en fonction de la valeur du pixel px. Par exemple, élément

body{font-size:20px;}
p{font-size:16px;}
p police La taille est de 16px

Valeur en pourcentage : Par rapport à l'unité de longueur, le pourcentage est très simple, c'est une valeur en pourcentage. Par exemple :

h1{line-height:150%;} Définissez la hauteur de ligne de tous les h1 à la moitié de la hauteur de ligne normale.

En bref, le pourcentage est toujours calculé à travers une autre valeur, qui sera mentionnée une à une dans l'explication des attributs plus tard. De plus, le pourcentage peut être positif ou négatif. Pour certains attributs, seules les valeurs positives sont acceptées, ce qui est une autre histoire.

Il y a tellement de contenu aujourd'hui et l'écriture est un peu brouillonne. J'espère que j'écrirai de mieux en mieux à l'avenir.

Pour plus d'articles liés à la couleur et à l'unité des attributs CSS courants, veuillez faire attention au site Web PHP chinois !