Maison >interface Web >tutoriel CSS >Unités de longueur relative en CSS
Unités de longueur relative en CSS
- WBOYavant
- 2023-08-26 20:57:031273parcourir
En CSS, les unités de longueur relative sont utilisées pour spécifier une longueur par rapport à un autre attribut de longueur.
| Numéro de série | Unité et description |
|---|---|
| 1 |
em par rapport à la taille de police de l'élément, c'est-à-dire que 4em signifie 4 fois la taille de police actuelle. |
| 2 |
ex hauteur x par rapport à la police actuelle |
| 3 |
ch largeur par rapport à 0
|
| 4 |
rem Taille de la police par rapport à l'élément racine |
| 5 |
vw 1% par rapport à la largeur de la fenêtre d'affichage* |
| 6 |
vh par rapport à 1 % de la hauteur de la fenêtre* |
| 7 |
vmin par rapport à la bouche de la fenêtre d'affichage * 1% de la plus grande taille |
| 9 |
% par rapport au élément parent |
| Exemple |
Regardons un exemple utilisant des unités de longueur relative : Démonstration <!DOCTYPE html>
<html>
<head>
<style>
.demo {
text-decoration: overline underline;
text-decoration-color: blue;
font-size: 1.4em;
}
</style>
</head>
<body>
<h1>Details</h1>
<p class="demo">Examination Center near ABC College.</p>
<p class="demo2">Exam begins at 9AM.</p>
</body>
</html>Sortie
|
Démonstration en direct
<!DOCTYPE html>
<html>
<head>
<style>
.demo {
text-decoration: overline underline;
text-decoration-color: blue;
font-size: 4ch;
}
</style>
</head>
<body>
<h1>Details</h1>
<p class="demo">Examination Center near ABC College.</p>
<p class="demo2">Exam begins at 9AM.</p>
</body>
</html> Sortie
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!