CSS：权威指南，第 5 版

第 5 章 数值和单位 数值和单位

本作品已使用人工智能进行翻译。欢迎您提供反馈和意见：[e-mail]

在本章中，我们将讨论几乎所有 CSS 功能的基础：影响颜色、距离和大小等一系列属性的单位，以及帮助定义这些值的单位。如果没有单位，你就无法声明图片周围应有 10 像素的空白空间，也无法声明标题文字应有一定的大小。理解了这里提出的概念，你就能更快地学习和使用 CSS 的其他部分。

关键字、字符串和其他文本值

样式表中的所有内容都是文本，但某些值类型直接表示文本字符串，而不是数字或颜色。这类值包括 URL，有趣的是，还包括图片。

关键词

，当需要用某个词来描述某个值时，CSS 提供了关键字。一个常见的例子是关键字none ，它与0 （零）不同。因此，如果要删除 HTML 文档中链接的下划线，可以这样写：

a[href] {text-decoration: none;}

同样，如果要在链接上强制加下划线，可以使用关键字underline 而不是none 。

如果一个属性接受关键字，其关键字将只在该属性的范围内定义。如果两个属性使用同一个词作为关键字，那么其中一个属性的关键字行为不一定与另一个属性共享。例如，为letter-spacing 定义的normal 与为font-style定义的normal 的含义就截然不同。

全球关键词

CSS定义了五个全局关键字，规范中的每个属性都接受这些关键字：inherit,initial,unset,revert, 和revert-layer 。

袭

关键字inherit 使元素上的属性值与其父元素上的属性值相同。换句话说，即使在通常情况下，继承也不会发生。在许多情况下，你并不需要指定继承，因为许多属性都是自然继承的。不过，inherit 仍然很有用。

例如，请考虑以下样式和标记：

#toolbar {background: blue; color: white;}

<div id="toolbar">
<a href="one.html">One</a> | <a href="two.html">Two</a> |
<a href="three.html">Three</a>
</div>

<div> 本身的背景为蓝色，前景为白色，但链接的样式将根据浏览器的偏好设置而定。链接最终很可能是蓝底蓝字，中间有白色竖条。

你可以编写一条规则，明确地将工具栏中的链接设置为白色，但你也可以使用inherit ，让事情变得更稳健一些。只需在样式表中添加以下规则即可：

#toolbar a {color: inherit;}

这将使链接使用color 的继承值来代替用户代理的默认样式。

通常情况下，直接指定的样式优先于继承的样式，但inherit 可以取消这种行为。 这可能并不总是一个好主意--例如，这里的链接可能会与周围的文本融合得过于紧密，从而成为可用性和可访问性方面的问题，但这是可以做到的。

同样，即使在正常情况下不会出现这种情况，也可以从父代中提取属性值。以border 为例，它（理所当然地）不被继承。如果您想让<span> 继承父代的边框，只需span {border: inherit;} 即可。但更有可能的情况是，您只希望<span> 的边框使用与其父代相同的边框颜色。在这种情况下，span {border-color: inherit;} 就可以了。

最初

关键字initial 将属性值设置为已定义的初始值，这在某种程度上意味着它 "重置 "了属性值。例如， ...