同学们,注意浏览器兼容性, animation-name:around;兼容IE
-moz-animation-name:around;兼容火狐
-webkit-animation-name:around;兼容谷歌
-moz-animation-name:around;兼容火狐
-webkit-animation-name:around;兼容谷歌
2015-08-14
.wrapper div:hover {
opacity: .8;
-webkit-transform: scale(0.8);
-moz-transform: scale(0.8);
transform: scale(0.8);
} //除了缩小,大家还可以改变opacity的值观察一下变化!
opacity: .8;
-webkit-transform: scale(0.8);
-moz-transform: scale(0.8);
transform: scale(0.8);
} //除了缩小,大家还可以改变opacity的值观察一下变化!
2015-08-13
.wrapper span {
display:block;
-webkit-transform: skew(-45deg);
-moz-transform: skew(-45deg);
transform:skew(-45deg);
}
display:block;
-webkit-transform: skew(-45deg);
-moz-transform: skew(-45deg);
transform:skew(-45deg);
}
2015-08-13
.wrapper span {
display:block;
-webkit-transform: rotate(20deg);
-moz-transform:rotate(20deg);
transform:rotate(20deg);
} 仔细观察图片中的白色文字,从倾斜变正了~
display:block;
-webkit-transform: rotate(20deg);
-moz-transform:rotate(20deg);
transform:rotate(20deg);
} 仔细观察图片中的白色文字,从倾斜变正了~
2015-08-13
1.图片地址和codepen里不一样
2.71行的.item img 中间空格忘了
3.中文注释没有/**/,我被这个坑死了!!!!
以上是造成没有效果的3大原因
2.71行的.item img 中间空格忘了
3.中文注释没有/**/,我被这个坑死了!!!!
以上是造成没有效果的3大原因
2015-08-12
实例演示通过translate()函数将元素向Y轴下方移动50px,X轴右方移动100px。演示的css代码有误吧或者是演示的题目描述有误!!
2015-08-12