关于animation作用域的问题
比如html的所有标签:块级啊行级啊或者inline-block啊都可以看做是一个盒模型,也就是可以加border设置margin和padding这些;
但是有些效果不是全局属性,只能加在块标签或者行标签上;
这两个东西要区分开。
不然会栽坑栽的亲妈都认不出来,别问我怎么知道的
各位请注意:
animation只能作用于div标签和类div标签————类div标签指的是和div一样的块级标签,就像老师case中的h2标签和p标签,像是img这种inline-block即行-块标签,以及行标签是不起作用的,如果要想在inline级标签上加animation动画效果,需要先给元素设置上div包裹起来,然后把animation属性设置到该div的id上。
我是照着老师的模板做的个人简历,section里装着一个img和一个ul,这俩都不是块级标签,所以我一开始想要给img加moveDown动画的时候总是加不进去,我反复查看了单词有没有拼错这种低级错误,查看了选择器的匹配到底正确不正确,查看了是不是浏览器问题,最终都排除掉了,我想那就只能剩下animation的作用域问题了;
然后就到w3c上查看了animation属性,果然只能作用于div标签,也就是说animation并不是一个全局属性,然后我就在我自己的代码上给img加上了一个div(我的img是position:absolute,所以加上了div后对img的位置毫无影响,大家做改动的时候要考虑标签position设置的影响),问题就解决了。