我注意到，在对CSS3 scale()进行动画处理时，似乎会像素化它所使用的每个元素。
示例:http://jsfiddle.net/PD7Vh/2/
在上面的示例中，将鼠标悬停在div上时，scale()将其像素化。
我的css设置是否错误，或者scale()自然是做什么的？
这是Windows 7上的Chrome的屏幕截图:
最佳答案
解决方案是开始您的中心圆所需的大小，然后将其缩小为引用起点。
然后，在悬停事件上，您可以放大到1，这将保留未像素化的中心圆。
引用:jsFiddle
注意，要进行其他设置(例如定位)是为了补偿这些变化。
状态更新:
考虑使用圆或轮廓的ASCII Character而不是使用border-radius来制作圆
圆圈:
•○☼oji
引用: jsFiddle(音符位置未校准。)
以上字符本质上是TEXT，因此请使用 ANY CSS2或CCS3 文本或字体属性!
当某些字符变得非常大时，它们确实会像素化，因此，如先前所回答的那样，对这些字符使用“反向比例”方法，但请注意，至少在Firefox中，使用超大字体时过渡会变得昂贵。最适合中型和大型字体。
提示:这种基于ASCII的方法可能需要和width and height properties才能正确实现定位，因此，如果定位似乎已损坏，请使用该方法。
关于CSS3 scale()导致div变为像素化，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/11318676/