css中的vw和vh作用

CSS 中 vw 和 vh 的作用

简要回答：
vw 和 vh 是 CSS 中的视口单位，用于根据浏览器窗口的视口大小设置元素尺寸和位置。

详细解释：

什么是视口单位？
视口单位是一种 CSS 单位，它以浏览器的视口尺寸为基础计算元素的尺寸和位置，无论设备或屏幕大小如何。

立即学习“前端免费学习笔记（深入）”；

vw 和 vh

如何使用 vw 和 vh
vw 和 vh 通常用于创建流式响应式布局，这意味着随着浏览器窗口大小的变化，元素的尺寸和位置也会相应调整。例如：

.container {  width: 50vw;  height: 50vh;}

此 CSS 代码会创建一个宽度为视口宽度一半、高度为视口高度一半的容器元素。

优点：
使用 vw 和 vh 的优点包括：

需要注意的事项：
虽然 vw 和 vh 提供了构建响应式布局的简单方法，但也需要注意以下事项：