虽然一直在现在的项目中用css动画,但是没去仔细思考兼容问题,现在做个思路总结
列几个 CSS动画相关属性的兼容图:
animation / keyframes
浏览器支持情况 :
从前在一个页面中有一张很普通的图片,普通到像这个样子
<img src="pic.jpg" alt="pic"/>
然后想要这张图片在移动端(比如max-device-width: 600px
)下的时候隐藏该图片,
但是直接display:none
的话发现浏览器还是会加载,这恐怕对于移动端寸KB寸金的资源来说是一场灾难。
于是琢磨怎么把图片弄消失掉,秉着能少写就少写写的原则,首先想到img
标签的srcset
属性。