CSS 数据类型 - dimension_CSS 菜鸟教程

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 	 	 该单位必须立即跟随数字。
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>

<< CSS 数据类型 - display-internal CSS - @container >>