CSS 数据类型

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

语法

<value><unit>

这里，<value> 是数值，<unit>；是测量单位。常见单位包括:

  • px:像素

  • em:相对于元素的字体大小

  • rem:相对于根元素的font-size

  • 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 单位必须紧跟在数字后面。
12"px" 单位是标识符，不应用引号引起来。
3sec 秒单位用“s”而不是“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>