效果如本博客中右边呢个浅色框框,来自webpack首页(IE绕路0_0)github地址:http://wjf444128852.github.io/demo02/css3/css3d/思路:1、关键是父元素ul的这2个属性 a:transform-style: prese ...
效果如本博客中右边呢个浅色框框,来自webpack首页(IE绕路0_0)
github地址:http://wjf444128852.github.io/demo02/css3/css3d/
思路:
1、关键是父元素ul的这2个属性
a:transform-style: preserve-3d;
b:transform: rotateX(-33.5deg) rotateY(45deg);
让ul先有点偏移旋转的效果!
2、分别让每个li相对于ul前后左右上下位移一定距离是li宽度的一半,6个面上的li的背景色是从中间向四周的渐变色
3、最下面的li当作阴影,需要特殊处理
4、定义动画帧让ul执行注意animation的参数和兼容性
/*animation: name duration timing-function delay iteration-count direction;*/
原标题:CSS3D效果
关键词:CSS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。