CSS3的transform属性的用法?

html-css011

CSS3的transform属性的用法?,第1张

定义和用法

transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。

语法

transform: none|transform-functions

旋转 div 元素:

div

{

transform:rotate(7deg)

-ms-transform:rotate(7deg) /* IE 9 */

-moz-transform:rotate(7deg) /* Firefox */

-webkit-transform:rotate(7deg)/* Safari 和 Chrome */

-o-transform:rotate(7deg) /* Opera */

}

1、可以将图片放大的容器或元素设置为fixed,这样就可以当鼠标悬停时,容器将会覆盖在其他图片上方;

2、将图片放大的容器设置为可以移动,这样可以让容器随着鼠标移动而移动,从而将其他图片挡住的情况防止;

3、给图片放大容器添加z-index,使其在其他页面元素之上,从而可以覆盖其他图片;

4、使用css设置一个悬停后改变图片大小的动态效果,直接将图片变大,从而不会有其他图片的阻挡;

5、使用CSS3的transform属性设置图片放大动态效果,从而实现无阻挡的图片放大。