css "as each of the properties of the shorthand"是什么意思？

Question

比如flex
https://developer.mozilla.org/zh-CN/docs/Web/CSS/flex
as each of the properties of the shorthand:
flex-grow: 0
flex-shrink: 1
flex-basis: auto

直译是 作为简写的每个属性
但是我不理解什么意思

---

我大概知道什么意思，就是flex的初始值是flex: 0 1 auto
但是看这个“as each of the properties of the shorthand:”实在有点别扭

Answer 1

那么就拿常用 padding 来举例吧。

正常来说，如果要设置一个元素的 padding 值，你需要通过设置 padding-top、padding-bottom、padding-left 和 padding-right 来控制四个方向的值。

div {
    padding-top: 1em;
    padding-bottom: 1em;
    padding-left: 1em;
    padding-right: 1em;
}

是不是太麻烦了，换成 padding 这个简写属性怎么样？

div {
    padding: 1em;
}

简写属性的目的很简单，把一些相关联的属性合在一起，然后根据参数数量来决定生效效果。比较常见的还有 background、margin。

参见：

• https://developer.mozilla.org/zh-CN/docs/Web/CSS/padding