gpt4 book ai didi

html - 为什么继承的 border-color 属性会失效?

转载 作者:太空宇宙 更新时间:2023-11-03 20:41:13 30 4
gpt4 key购买 nike

我在一个 div 元素中有一个 div 元素。外部 div 具有 colorborder-color 的样式属性。内部 div 继承它。

<html>
<head><style>#foo{color: red; border-color: green;}</style></head>
<body>
<div id="foo" style="border-width: 6; border-style: solid; padding: 10;">
<div style="border-width: 6; border-style: solid; height: 10;"></div>
</div>
</body>
</html>

当我在浏览器上渲染它时,外部 div 的边框呈现为绿色,正如预期的那样,但内部 div 的边框呈现为红色,这出乎我的意料。

embedded divs

当我查看 Google Chrome 的开发者工具时,colorborder-color 属性都对外部 div 有效:

outer div

但是对于继承属性的内层div,color有效,border-color无效,导致边框颜色变为红色,是由 color 属性指定的颜色:

inner div

为什么继承的border-color属性无效?有没有办法让它有效?

最佳答案

根据定义,border-color不是继承的(除非你明确地给它赋值inherit)。内部 div 上没有 border-color,所以它采用初始值,根据定义,它是 color 属性的值元素的。

因此您需要在元素上显式设置border-color

关于html - 为什么继承的 border-color 属性会失效?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25650733/

30 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com