css如何将图像旋转90度:使用transform属性旋转图像,如transform3360rotate(90deg )。 transform属性用于元素的二维或三维变换,可以旋转、缩放、移动和倾斜元素。
属性介绍:
Transform属性应用于元素的2D或3D转换。 此属性允许您旋转、缩放、移动和倾斜元素。
(学习视频推荐: css视频教程)
语法: transform : none|transform-functions;
属性值:不转换none定义。
转换(x,y )定义二维变换。
平移3d (x,y,z )定义3d变换。
translatex(x )定义变换,仅使用x轴的值。
translatey(y )定义变换,仅使用y轴的值。
translatez(z )定义三维变换,仅使用z轴的值。
代码实现:
实体
{
margin:30px;
背景色: # e9e9e 9;
}
div.polaroid
{
width:294px;
padding:10px 10px 20px 10px;
border :1 px固态# bfbf BF;
背景色: white;
/*添加盒- shadow * /
box-shadow:2px2px3px#aaaaaa;
}
div.rotate
{
- MS-transform 3360 rotate (90度); /* IE 9 */
- WebKit-transform 3360 rotate (90度); /* Safari and Chrome */
变换:旋转(90度);
}
普通图像
把照片旋转90度
实现效果:
推荐教程: CSS教程