24 个关于设备视窗口的 CSS 单位

文章目录

  • vw (视口宽度)
  • vh:(视口高度)
  • vi:
  • VB:

vw (视口宽度)

vw 代表视口宽度的百分比。
例如,如果你写了 10vw,那么,这将构成视口宽度的 10% 的。
视口只是屏幕比例的一个精心设计的短语,因此,如果你使用的是宽度为 1920 像素的大型计算机设备,则 10vw 就是 192 像素。
如果你使用的是宽度为 300 像素的手机,那么 10vw 刚好是 30 像素。

vh:(视口高度)

Vh 代表视口高度的百分比。

vi:

vi 代表 Viewport Inline,代表文档的内联方向。在水平书写方向上,这对应于视口的宽度,而在垂直书写方向上,这表示视口的高度。
记住 inline 方向的简单方法是记住它与文本的方向相同。另一种记住这一点的方法是,如果你有两个彼此相邻的内联元素(例如两个跨度),那么它们堆叠的方向就是你的内联方向。

VB:

vb 代表 Viewport Block,代表文件的块路径。这是 vi 的另一个,因此在水平写入路径中,这可以对应于视口顶部,而在垂直文件中,这可以构成视口的宽度。
如果你不想忘记这个单元,请不要忘记块路由将始终是块元素(作为实例 div)将堆叠在另一个顶点上的路由。

你可能感兴趣的:(css,前端)