为什么CSS outline简写属性写outline: inherit dotted 2px会无效？

核心规则 #

CSS 中的inherit、initial、unset、revert属于全局关键字，在任何简写属性中只能单独使用，不能和其他具体属性值混合编写。

对问题场景的解释 #

1. 你写的outline: initial dotted 2px属于非法语法：全局关键字initial和具体值dotted、2px混合出现在outline简写属性中，浏览器会直接判定该属性值无效，所以第一个a标签没有轮廓效果。outline: inherit dotted 2px失效也是相同原因。
2. 拆分属性写法合法的原因：拆分后每个子属性是独立声明的，outline-color: initial是符合规范的单属性赋值，和另外两个子属性的具体值互不冲突，所以可以正常生效。

补充说明 #

如果要在outline简写中使用全局关键字，只能单独编写，例如outline: initial，该写法等价于同时给outline-color、outline-style、outline-width三个子属性都设置为initial。

内容的提问来源于stack exchange，提问作者user31782