Résumé des unités communes en CSS

Aujourd'hui, j'ai résumé les 15 unités les plus couramment utilisées en CSS. Pour vous aider à comprendre, je vais les lister une par une ci-dessous.

1.px : Unité absolue, la page est affichée en pixels précis

2.em : Unité relative, le point de référence est la taille de police du nœud parent, si vous définissez font-size yourself Calculé par lui-même (la police par défaut du navigateur est de 16px), 1em n'est pas une valeur fixe dans toute la page.

3.rem : Unité relative, qui peut être comprise comme "root em", calculée par rapport à la taille de la police du nœud racine HTML CSS3 ajoute un nouvel attribut , pris en charge par Chrome. /firefox/IE9+.

4.vw : point de vue largeur, largeur de la fenêtre, 1vw est égal à 1% de la largeur de la fenêtre.

5.vh : point de vue hauteur, la hauteur de la fenêtre, 1vh est égal à 1% de la hauteur de la fenêtre.

6.vmin : Le plus petit de vw et vh.

7.vmax : Le plus grand de vw et vh.

8.% : pourcentage

9.in : pouce

10.cm : centimètre

11.mm : millimètre

12.pt:point, environ 1/72 de pouce

13.pc:pica, environ 6 pt, 1/6 de pouce

14.ex : obtenez la hauteur x de la police du effet actuel, calculé comme 0,5em lorsque la hauteur x ne peut pas être déterminée (non pris en charge par IE11 et versions antérieures, firefox/chrome/safari/opera/ios safari/android navigateur 4.4+, etc. nécessitent tous attributs à ajouter) Préfixe)

15.ch : Basé sur le caractère "0" dans la police utilisée par le nœud, s'il n'est pas trouvé, il s'agit de 0,5em (ie10+, chrome31+, safair7.1+, opera26+, ios safari 7.1+, support du navigateur Android 4.4+)

Je pense que vous avez compris le rôle de ces unités après avoir lu ceci. Pour un contenu plus passionnant, veuillez faire attention au site Web php chinois autre. articles connexes !

Lecture connexe :

Introduction détaillée de CSS3 à l'attribut translation

L'attribut background-size de CSS3 Introduction détaillée

Tutoriel sur l'utilisation de l'attribut transform en Css3

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!