半径:50%在Chrome中不会产生完美的圈子

通常border-radius: 50%适用于大多数应用程序,Chrome可以生成看起来像一个圆圈。 但在这种情况下,我试图不断快速旋转一个圆圈,而这正是这些问题表现出来的地方。

看看这个codepen看看我在说什么。 注意外边缘如何摆动?

http://codepen.io/jonshungry/pen/edmpf

这是Chrome的边界半径问题吗? 或者这与变换有关吗?

任何人都可以提出解决办法吗?


这是由“半径”计算方式中的舍入引起的。 由于尺寸是偶数,因此边界是“中间”两个像素......历史悠久,最后:

Workarround:设置您的div圆圈大小为“奇数”个像素。

$ring-medium-outer: 437px;
$ring-medium-inner: 381px;
链接地址: http://www.djcxy.com/p/20745.html

上一篇: radius: 50% not producing perfect circles in Chrome

下一篇: Declare a variable or constant that conforms to a protocol in Swift