css3 - safari頁面的一出設置了css動畫，影響頁面其他地方文字的font-weight
問題描述
正常狀態
動畫狀態
最后動畫執行完又變回正常狀態
animation-duration: 3s; animation-name:listAnimation; animation-fill-mode: both; -webkit-animation-duration: 3s; -webkit-animation-name:listAnimation; -webkit-animation-fill-mode: both; -moz-animation-duration: 3s; -moz-animation-name:listAnimation; -moz-animation-fill-mode: both; -o-animation-duration: 3s;-o-animation-name:listAnimation;-o-animation-fill-mode: both; animation-fill-mode: both;
@-webkit-keyframes listAnimation { 0% {-webkit-transform: perspective(400px) rotateY(90deg);-moz-transform: perspective(400px) rotateY(90deg);-o-transform: perspective(400px) rotateY(90deg);transform: perspective(400px) rotateY(90deg);filter:alpha(opacity=0);-moz-opacity:0;opacity:0; } 40% {-webkit-transform: perspective(400px) rotateY(-10deg);-moz-transform: perspective(400px) rotateY(-10deg);-o-transform: perspective(400px) rotateY(-10deg);transform: perspective(400px) rotateY(-10deg) } 70% {-webkit-transform: perspective(400px) rotateY(10deg);-o-transform: perspective(400px) rotateY(10deg);-moz-transform: perspective(400px) rotateY(10deg);transform: perspective(400px) rotateY(10deg) } 100% {-webkit-transform: perspective(400px) rotateY(0deg);-moz-transform: perspective(400px) rotateY(0deg);-o-transform: perspective(400px) rotateY(0deg);transform: perspective(400px) rotateY(0deg);filter:alpha(opacity=100);-moz-opacity:1;opacity:1; }}
問題解答
回答1：https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_animated_properties試過強制在keyframe里指定font-weight嗎？
網公網安備