Css 为什么Chrome总是添加1px的边框半径,即使特定的角点设置为0px?

Css 为什么Chrome总是添加1px的边框半径,即使特定的角点设置为0px?,css,google-chrome,Css,Google Chrome,当你在Google Chrome中对一个元素应用边框半径时,我注意到所有的角都有一个1像素的圆角,即使特定的角被设置为0像素 考虑以下几点: .box{float:左;边距:5px;宽度:25px;高度:25px;边框:1px实心#888;} .box1{边界半径:0;} .box2{边界半径:1px;} .box3{边界半径:0 0 5px 5px;} 对于像我这样被这个Chrome bug困扰的像素完美主义者,我想出了一个可能的解决方案: 如果尚未对元素上的其他内容使用:之前的,则可以使用

当你在Google Chrome中对一个元素应用
边框半径时,我注意到所有的角都有一个1像素的圆角,即使特定的角被设置为0像素

考虑以下几点:

.box{float:左;边距:5px;宽度:25px;高度:25px;边框:1px实心#888;}
.box1{边界半径:0;}
.box2{边界半径:1px;}
.box3{边界半径:0 0 5px 5px;}

对于像我这样被这个Chrome bug困扰的像素完美主义者,我想出了一个可能的解决方案:

如果尚未对元素上的其他内容使用
:之前的
,则可以使用该选项覆盖元素,使其具有1px的上边框,该边框与基本元素的边框颜色相同,并使其看起来具有锐角。它很粗糙,但很管用

.box{float:左;边距:5px;宽度:25px;高度:25px;边框:1px实心#888;}
.box1{边界半径:0;}
.box2{边界半径:1px;}
.box3{边界半径:0 0 5px 5px;}
.box4{边界半径:0 0 5px 5px;位置:相对;}
.box4:在{内容:;位置:绝对;顶部:-1px;左侧:-1px;右侧:-1px;高度:1px;边框顶部:1px实心35; 888;}之前


可能是因为只有很少人有敏锐的眼光去注意它;)只需将其记录为Chrome bug,尽管考虑到严重性,我不希望它很快得到修复。实际上,它并不完全是一个
1px
半径。这是带有抗锯齿的
0px
半径的结果。如果你比较结果的颜色,你会发现它们略有不同。问题是,抗锯齿应该只应用于边界半径为正的拐角处,但我不确定目前是否有可能选择性地应用。我相信它要么被应用(当一个角落需要它时),要么不被应用。这是一项困难的任务(从技术上讲),几乎不值得注意=>低优先级。尝试添加
transform:rotateZ(0.001deg)
,这会改变什么吗?