携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第7天，点击查看活动详情

1️⃣前言

大家好，我是翼同学，今天笔记的内容是：

2️⃣关键字

CSS提供了四个关键字，每个CSS属性都可以接受这些关键字，用于设置属性的基础情况。

接下来我们分别来看各个关键字的作用。

关键字inherit可以让一个不具备继承特性的属性能够继承父元素的定义，使得子元素能够获得父元素的属性值。简单的说就是，inherit关键字指定一个属性应从父元素继承它的值。

举个例子：

我之间的笔记里写过，height和width是最常见的不可继承的属性。那么当子元素的height属性被设为inherit时，子元素便获取到父元素的计算值。如下所示：

div {
    height: 400px;
    border: 1px solid;
}
p {
    background-color: pink;
}

效果如下：

此时设置子元素<p>的行高：

p {
    height: inherit;
}

效果如下：

initial关键字用于将属性的默认值应用于元素。简单的说就是将属性设置为默认值。这也很好理解，将属性恢复到初始状态。

举个例子：

<div>
    <h3>标题</h3>
    <p>这是一个段落</p>
</div>

将<div>标签的文本颜色color属性设置为skyblue，效果如下：

此时将<h3>标签的color属性值设置为initial：

h3 {
    color: initial;
}

效果如下：

unset关键字用于将属性重置为自然值。

该关键字的应用场景分两种：

总的来说，关键字unset用于将属性设置为自然值，如果属性是自然继承，那么效果和inherit一样，否则就和initial一样。

好了，今天的笔记就记到这里。