css怎么让图片旋转90度

css让图片旋转90度的方法:利用transform属性来进行图片旋转,如【transform:rotate(90deg)】。transform属性用于元素的2D或3D转换,该属性允许我们将元素旋转、缩放、移动、倾斜。

css怎么让图片旋转90度

属性介绍:

Transform属性应用于元素的2D或3D转换。这个属性允许你将元素旋转,缩放,移动,倾斜等。

(学习视频推荐:css视频教程)

语法:

立即学习“前端免费学习笔记(深入)”;

transform: none|transform-functions;

属性值:

none    定义不进行转换。    

translate(x,y)    定义 2D 转换。    

translate3d(x,y,z)    定义 3D 转换。    

translateX(x)    定义转换,只是用 X 轴的值。    

translateY(y)    定义转换,只是用 Y 轴的值。    

translateZ(z)    定义 3D 转换,只是用 Z 轴的值。    

代码实现:

  body{margin:30px;background-color:#E9E9E9;}div.polaroid{width:294px;padding:10px 10px 20px 10px;border:1px solid #BFBFBF;background-color:white;/* Add box-shadow */box-shadow:2px 2px 3px #aaaaaa;}div.rotate{-ms-transform:rotate(90deg); /* IE 9 */-webkit-transform:rotate(90deg); /* Safari and Chrome */transform:rotate(90deg);}
正常图片@@##@@


图片旋转90度@@##@@

实现效果:

css怎么让图片旋转90度

推荐教程:CSS教程

css怎么让图片旋转90度30e8503a7db6cc73b5d15585db9afba.png

以上就是css怎么让图片旋转90度的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1616157.html

赞 (0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
css3中2d变形有几种?
上一篇 2025年12月24日 05:15:50
SenCSS是什么?
下一篇 2025年12月24日 05:15:59

相关推荐

发表回复

登录后才能评论
关注微信