问带有继承值的边框颜色失败。

EN

它失败了，因为根据border-color的定义，关键字inherit仅允许作为属性本身的值，而不是作为一个组件与其他值一起使用。这就是我们描述的

    [ <color> | transparent ]{1,4} | inherit

意思:您可以有一个到四个组件，每个组件要么是颜色标识，要么是关键字transparen，或者是inherit本身。

涉及到一个Opera，但是bug是值transparent inherit (和transparent transparent inherit)“工作”，即按照您的意思执行，而不是按照规范执行它必须做的事情。根据CSS错误处理规则，当值在语法上不正确时，必须忽略声明。(Chrome与Opera共享这个bug，但Firefox和IE做的是对的。)

例如，要实现border-color: transparent inherit的意思(即设置顶部和底部边框颜色透明，左和右边框颜色继承)，您需要以不同的方式在单独的声明中设置单个边框组件。

​

div { border-color: red }
span {
  border-style: solid;
  border-color: transparent;
  border-left-color: inherit;
  border-right-color: inherit;
}

<div>
  <span>Hello world</span>
</div>

​

经过一些谷歌，它看起来像CSS继承关键字是全部或什么都没有，所以它不能用于速记。您得到的结果反映了对“无效”规则的不一致解释。

另见：this discussion。

但是，只要您的规则声明都是有效的，您就应该能够覆盖您想要继承的特定属性。代替：

border-color: inherit transparent;

你应该使用：

border-color-left: transparent;
border-color-right: transparent;

不幸的是，我认为你不能再缩短它了。