CSS 数据类型 - <dimension>

CSS <dimension> 数据类型表示沿单个轴的测量值。它用于接受长度、宽度、高度、边距、内边距等单位值的属性。此数据类型允许您使用各种单位指定测量值，例如距离(<length>)、持续时间(<time>)、频率(<frequency>)、分辨率(<resolution>)以及其他各种数量。

语法

<value><unit>

这里，<value> 是一个数值，<unit> 是测量单位。常用单位包括：

px：像素
em：相对于元素的字体大小
rem：相对于根元素的字体大小
vw：相对于视口宽度的 1%
vh：相对于视口高度的 1%
cm, mm, in, pt, pc：绝对长度单位

有效的尺寸

以下示例显示了使用不同单位来指定长度、时间和频率：

20px     20 pixels
2rem     2 rem
1.5pt    1.5 points
1400ms   1400 milliseconds
10s       10 seconds
100hz    100 Hertz
100Hz    100 Hertz (values are case insensitive)

无效的尺寸

使用<dimension>数据类型时，需遵循以下规则：

12 px     The unit must immediately follow the number.
12"px"    Units are identifiers and should not be surrounded by quotations.
3sec      The seconds unit is denoted by "s" rather than "sec".

CSS <dimension> - 高度

以下示例演示了通过将宽度和高度指定为 100px 来使用<dimension>：

<html>
<head>
<style>
   .box {
      width: 100px; 
      height: 100px; 
      background-color: pink; 
   }
</style>
</head>
<body>
   <div class="box">
      <dimension>
   </div>
</body>
</html>

打印页面