2

Firefoxのcssアニメーションが要素のエッジをピクセル化しているようです。

これが縮小されたケースです-

.test {
    width: 100px;
    height: 100px;
    border-radius: 0 0 14px 14px;
    left: 150px;
    top: 150px;
    background-color: black;
    -webkit-animation: move 4s ease 0ms both infinite;
    -moz-animation: move 4s ease 0ms both infinite;
}
@-moz-keyframes move {
    from { -moz-transform: rotate(0deg); }
    to { -moz-transform: rotate(10deg); }
}
@-webkit-keyframes move {
    from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(10deg); }
}
<div class="test"></div>

これはWebkitでは問題ないように見えますが、Firefoxではがらくたになります...誰かアイデアはありますか?

4

1 に答える 1

7

要素のスタイリングにこれを追加してみてください:

outline: 1px solid transparent;

これはかなり奇妙な回避策ですが、あなたの場合はうまくいくはずです。

于 2012-06-22T22:22:42.427 に答える