Maison > Article > interface Web > Qu'est-ce que VW en CSS
Qu'est-ce que VW en CSS
- WBOYoriginal
- 2022-04-18 16:01:304923parcourir
En CSS, vw est une unité de fenêtre et une unité relative, ce qui signifie un pourcentage de la largeur de la fenêtre ; vw est relatif à la largeur de la fenêtre. La fenêtre est la zone visible du navigateur client, et la fenêtre. est divisé à parts égales. Pour 100 unités, la taille de 1vw correspond à un pour cent de la largeur de la fenêtre.
L'environnement d'exploitation de ce tutoriel : système Windows 10, version CSS3&&HTML5, ordinateur Dell G3.
Qu'est-ce que vw en CSS ?
L'unité CSS est une unité de mesure, comprenant les unités de taille et les unités de couleur. Nous utilisons souvent des unités en vis-à-vis pour éviter de confondre la mise en page de la page Web dans différentes vues.
vw est l'abréviation de la largeur de la fenêtre d'affichage. 1vw est toujours égal à un centième de la largeur actuelle de la fenêtre. vw est une unité de fenêtre et une unité relative. La fenêtre d'affichage est divisée en 100 unités de VW par rapport à sa largeur.
L'avantage de vw est qu'il peut obtenir directement la largeur. Cependant, l'utilisation de % ne peut pas obtenir correctement la largeur de la zone visuelle sans définir la largeur du corps, c'est donc un bon avantage.
La fenêtre ici fait référence à la zone visible du navigateur, comme indiqué ci-dessous :
Exemple de code :
h1{font-size:8vw;}Si la largeur de la fenêtre est de 200 mm, alors la taille de police de l'élément h1 dans le le code ci-dessus sera de 16 mm, soit (8x200)/100
L'exemple est le suivant :
<html>
<style>
.p1{font-size:5vw;}
.p2{font-size:5px;}
</style>
</head>
<body>
<p class="p1">相对于viewport宽度大小的文字</p>
<p class="p2">px宽度大小的文字</p>
</body>
</html>Résultat de sortie :
(Partage vidéo d'apprentissage : tutoriel vidéo CSS)
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!