border-color失败并具有继承值

我最近发现边框颜色有问题.

border-color: inherit //work
border-color: inherit transparent //fail
border-color: transparent inherit //work
border-color: inherit transparent transparent //fail
border-color: inherit transparent transparent transparent //fail

为什么这些"第一价值继承"边框颜色失败？

它失败了,因为根据定义border-color,关键字inherit只能作为属性的值自身,而不能与其他值一起作为组件.这就是描述

    [  | transparent ]{1,4} | inherit

意思是:你可以有一到四个组件,每个组件都是颜色标识或关键字transparen,或者 inherit这样.

涉及Opera错误,但错误是值transparent inherit(和transparent transparent inherit)"有效",即按照您的意思行事,而不是按照规范执行必须执行的操作.根据CSS错误处理规则,当语法语法错误时,必须忽略声明.(Chrome与Opera共享此错误,但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;
}

  Hello world