为啥CSS3 animation在chrome下可以,Safari不可以

如题所述

animation是css3的新属性,尚处于实验阶段,各种不同内核的浏览器都在进行试验中,也就是说animation在不同的浏览器中其支持程度、运行效果等方面是存在差别的,因此为了保证网页在各种浏览器中的兼容性,就要给animation添加各种浏览器特有的前缀,比如说 -webkit-animation 只有webkit内核的浏览器才能识别并执行,其他则会自动忽略。目前,IE10+、Firefox 以及 Opera 都已支持标准的 animation 属性,而 Safari 和 Chrome(它们都是webkit内核)则只支持 -webkit-animation 属性,所以你的代码简写成以下即可:-webkit-animation: animations 2s ease-out 1s backwards;animation: animations 2s ease-out 1s backwards;
温馨提示:内容为网友见解,仅供参考
无其他回答

为啥CSS3 animation在chrome下可以,Safari不可以
也就是说animation在不同的浏览器中其支持程度、运行效果等方面是存在差别的,因此为了保证网页在各种浏览器中的兼容性,就要给animation添加各种浏览器特有的前缀,比如说 -webkit-animation 只有webkit内核的浏览器才能识别并执行,

为什么浏览器把我css3属性禁用了
目前这个属性只有Chrome和Safari浏览器支持,其他浏览器中是无效的。如果你在Chrome中也是没效果,那么我们要看到相对完整的html+css代码才能知道原因。

css3的animation在ios中不能无限循环播放
try this : UIView.animationRepeatCount =HUGE_VALF; 亲测repiat forever

能说CSS3,-webkit-animation,-moz-animation,-o-animation,-ms-anim...
animation是css3的新属性,尚处于实验阶段,各种不同内核的浏览器都在进行试验中,也就是说animation在不同的浏览器中其支持程度、运行效果等方面是存在差别的,因此为了保证网页在各种浏览器中的兼容性,就要给animation添加各种浏览器特有的前缀,比如说 -webkit-animation 只有webkit内核的浏览器才能识别并...

手机上的css3动画为什么不动
你好,这个问题应该是css兼容性问题导致的。目前绝大部分移动浏览器还不支持animation这个属性,而是支持-webkit-animation(这类加前缀的)属性,在问题中:.ih { background: #000; opacity:.3;width: 90%; height: 25%; margin-left:-45%; position: absolute;bottom: 120px;left:50%; anim...

手机css3动画不运行的原因是什么?
,如果你是用在webkit内核的浏览器,最好这样写:-webkit-transition: all 5s linear 1s;transition: all 5s linear 1s;2、魅族note2上UC,火狐,chrome,魅族自带浏览器均有动画。只有手机Opera没有动画。可以试一下加上针对不同浏览器的css前缀补全。或者在meta里加上浏览器打开h5模式的标识。

现在主流浏览器最新版本对CSS3的支持都非常差+对不对?
不完全正确。主流浏览器(如Chrome、Firefox、Safari、Edge等)对CSS3的支持已经非常成熟,并且持续更新以支持新的CSS3功能和规范。CSS3是CSS的最新版本,引入了许多新的特性和功能,包括动画、过渡、阴影、圆角、渐变等。主流浏览器在这些方面提供了很好的支持,使开发人员能够在网页中使用这些功能,实现更...

JS动画比CSS3动画性能谁更好?
在iOS Safari: 这里,无论是CSS3还是JavaScript动画,只要避免不必要的重排,都能轻松实现流畅体验。毕竟,性能优化是关键。挑战在iOS Webview: 在这里,由于JavaScript的性能下降,CSS3动画可能是更好的选择,特别是在某个版本更新后,这种限制可能得到了缓解。但对于早期的版本和低版本Android,情况则大相...

u站支持css3吗
css3是客户端样式,u站支持没用,需要用户的浏览器支持才行。目前CSS Transforms 3D 还没有浏览器支持,除此之外的其它属性在 Windows 平台,Chrome 和 Safari 全部支持,其次支持比较好的是 Opera 和 Firefox。IE 6\/7\/8基本不支持css3特效,IE的9\/10\/11支持CSS3越来越好。所以客户群使用IE浏览器...

CSS3 的动画的意义何在?
回答:让你的页面动画在移动设备上运行更快。这是一个有趣的话题。这也是移动互联网前端工程师关心的问题。 我们都知道JavaScript效率低下的两个主要原因:操作DOM和使用页面动画。浏览器上的动画效果并不比客户端容易。通常情况下,我们会通过频繁的CSS操作来实现视觉动画效果。在DOM和CSS的频繁操作,浏览器...

相似回答