透明边框上的圆角使 Chrome 中的半透明度加倍
当向具有透明边框的元素添加边框半径时，Chrome 似乎会加倍角落的不透明度，使它们半透明。
代码和示例位于： http://jsfiddle.net/shodan_uk/LMPMg/
任何人都有任何想法为了解决这个问题？
干杯， 特里
When adding border-radius to an element with a transparent border, Chrome seems to double up opacity on the corners, making them translucent.
Code and example at: http://jsfiddle.net/shodan_uk/LMPMg/
Anybody got any ideas how to get round this?
Cheers,
Terry
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
这是 Webkit 的一个已知错误，您可以添加一个包装容器来伪造边框并应用边框半径，或者稍微更改不透明度值或边框（这会在元素的角上产生一些微弱的线条。
请参阅演示这里： http://jsfiddle.net/duopixel/hG9W8/
这是一个类似的问题给你的：
Webkit 中奇怪的边框不透明度行为？
This is a known bug of Webkit, you can either add a wrapping container to fake the border and apply border-radius, or change the opacity value or the border slightly (this will produce some faint lines on the corner of your element.
See demo here: http://jsfiddle.net/duopixel/hG9W8/
And here is the a similar question to yours:
Weird border opacity behavior in Webkit?
是的，我也遇到过类似的问题。我使用 css3 边框图像来代替，以获得与最初预期相同的效果。
Yes I've had a similar issue. i used css3 border image instead to get the same effect as originally intended.