我注意到在 div 上应用虚线边框和 border-radius
会创建长度错误的“虚线”。
请查看下面 Angular 落附近的图片,该问题仅出现在 Firefox 44 和 46 上,在 Chrome 49 上看起来很好。
看起来像a bug in FF .我知道 border-radius 在 FF 上有问题,但我想知道是否有解决方法。
*,
*:after,
*:before {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#target {
width: 300px;
height: 300px;
background-color: red;
border: 10px dashed purple;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
border-radius: 30px;
}
<div id="target"></div>
最佳答案
使用 border
的 css 属性你不能实现它。
CSS 渲染是特定于浏览器的,我认为唯一的解决方法是使用图像。
关于html - 带有应用边框半径的虚线边框在 Firefox 中长度错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36055372/