css-----unset

感觉是去掉默认样式的意思，如果可以继承样式则继承父元素的样式，如果不能继承，则用默认样式；

名如其意，unset 关键字我们可以简单理解为不设置。其实，它是关键字 initial 和 inherit 的组合。

什么意思呢？也就是当我们给一个 CSS 属性设置了 unset 的话：

1. 如果该属性是默认继承属性，该值等同于 inherit
2. 如果该属性是非继承属性，该值等同于 initial

举个例子，根据上面列举的 CSS 中默认继承父级样式的属性，选取一个，再选取一个不可继承样式：

• 选取一个可继承样式: color
• 选取一个不可继承样式: border

<div class="father">
    <div class="children">子级元素一</div>
    <div class="children unset">子级元素二</div>
</div>
.father {
    color: red;
    border: 1px solid black;
}
 
.children {
    color: green;
    border: 1px solid blue;
}
 
.unset {
    color: unset;
    border: unset;
}

1. 由于 color 是可继承样式，设置了 color: unset 的元素，最终表现为了父级的颜色 red。

2. 由于 border 是不可继承样式，设置了 border: unset 的元素，最终表现为 border: initial ，也就是默认 border 样式，无边框。

栗子

left 与right 元素分别定为左边和右边

<div class="container">
    <div class="left">fixed-left</div>
    <div class="right">fixed-right</div>
</div>

css 原来写法

.left,
.right {
    position: fixed;
    top: 0;   
    ...
}
.left {
    left: 0;
}
.right {
    right: 0;
}

css 可以这么写

.left,
.right {
    position: fixed;
    top: 0;   
    left: 0;
    ...
}
.right {
    left: unset;
    right: 0;
}