gpt4 book ai didi

css - Webkit 中奇怪的边框不透明行为?

转载 作者:行者123 更新时间:2023-11-28 09:14:56 25 4
gpt4 key购买 nike

我一直在测试不透明的边框,Webkit 似乎有一种奇怪的行为。

这是我的代码

<style>
div{
position: relative;
width: 300px;
height: 300px;
background: #00f;
}
span{
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
border: 10px solid rgba(255, 255, 255, 0.5);
}
</style>
<div>
<span></span>
</div>

可以测试一下here .在 Firefox 中,您会得到预期的结果:div 周围有一个 10 像素的白色内部边框,不透明度为 50%,但是,至少 Chrome(但我怀疑是 Webkit)似乎与边框的边框重叠(不知何故这是有道理的)。而且我认为这不是故意的,因为它本身似乎是重叠的!

这是一个错误还是只是一个预期的功能

最佳答案

Chrome 问题列表中的错误(猜猜看,没人关心):
http://code.google.com/p/chromium/issues/detail?id=36475&q=transparent%20border%20color&colspec=ID%20Stars%20Pri%20Area%20Feature%20Type%20Status%20Summary%20Modified%20Owner%20Mstone%20OS

看看规范,这确实像是一个错误:
http://www.w3.org/TR/css3-background/#box-shadow-samples

示例也有带 alpha 的内部边框,并显示类似 Firefox 的行为。

关于css - Webkit 中奇怪的边框不透明行为?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4541120/

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