CSS 数据类型 - absolute-size



CSS <absolute-size>数据类型在属性 font shorthand 和 font-size 中定义了绝对字体大小。

可能的值

  • xx-small - 指定字体大小,即介质大小的 60%。并等同于已弃用的 size=“1”。
  • x-small - 指定字体大小为默认字体大小的75%。
  • small − 指定字体大小为默认字体大小的89%,相当于已弃用的size=“2”。
  • medium - 用户首选的大小。它将默认字体大小指定为参考中间值,并等同于已弃用的 size=“3”。
  • large − 指定字体大小比默认字体大小大 20%,相当于已弃用的 size=“4”。
  • x-large - 指定的字体大小比默认字体大小大50%,相当于已弃用的size=“5”。
  • xx-large - 指定的字体大小是默认字体大小的两倍,相当于已弃用的 size=“6”。
  • xxx-large - 指定的字体大小是默认字体大小的三倍,相当于已弃用的 size=“7”。

语法


 font-size = xx-small | x-small | small | medium | large | x-large | xx-large | xxx-large;

下表显示了不同绝对大小关键字的缩放因子。它还显示了这些关键字如何与标题大小 (<h1> 到 <h6>) 以及已弃用的 HTML size 属性相关联。

<absolute-size> xx-small x-small small medium large x-large xx-large xxx-large
比例 3/5 3/4 8/9 1 6/5 3/2 2/1 3/1
HTML 标题 h6   h5 h4 h3 h2 h1
HTML size 属性 1   2 3 4 5 6 7

CSS <absolute-size> - 示例

以下示例演示了如何使用 font-size 属性使用不同的字体大小 -


<html>
<head>
<style>
	 	p {
	 	 	 margin-bottom: 5px;
	 	}
	 	.font-xx-small {
	 	 	 font-size: xx-small;
	 	}
	 	.font-x-small {
	 	 	 font-size: x-small;
	 	}
	 	.font-small {
	 	 	 font-size: small;
	 	}
	 	.font-medium {
	 	 	 font-size: medium;
	 	}
	 	.font-large {
	 	 	 font-size: large;
	 	}
	 	.font-x-large {
	 	 	 font-size: x-large;
	 	}
	 	.font-xx-large {
	 	 	 font-size: xx-large;
	 	}
	 	.font-xxx-large {
	 	 	 font-size: xxx-large;
	 	}
</style>
</head>
<body>
	 	<p class="font-xx-small">xx-small</p>
	 	<p class="font-x-small">x-small</p>
	 	<p class="font-small">small</p>
	 	<p class="font-medium">medium</p>
	 	<p class="font-large">large</p>
	 	<p class="font-x-large">x-large</p>
	 	<p class="font-xx-large">xx-large</p>
	 	<p class="font-xxx-large">xxx-large</p>
</body>
</html>