永发信息网

我想问个问题,怎么用CSS定义每张图片旋转90°输出?

答案:2  悬赏:0  手机版
解决时间 2021-07-31 22:51
  • 提问者网友:欺烟
  • 2021-07-31 08:25

我想问个问题,怎么用CSS定义每张图片旋转90°输出?

例如下图1是原图,图2是想要的输出效果

不想每张图片都要用软件处理90°,就是想在网页上用CSS解决或网页代码

最佳答案
  • 五星知识达人网友:神也偏爱
  • 2021-07-31 09:27

<img src=" http://www.baidu.com/img/baidu_logo.gif" style="filter : progid:DXImageTransform.Microsoft.BasicImage(Rotation=1)" />


用滤镜

全部回答
  • 1楼网友:一把行者刀
  • 2021-07-31 11:01

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns=" http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <style> .mod1 {filter:progid:DXImageTransform.Microsoft.BasicImage(Rotation=0);} .mod2 {filter:progid:DXImageTransform.Microsoft.BasicImage(Rotation=1);} .mod3 {filter:progid:DXImageTransform.Microsoft.BasicImage(Rotation=2);} .mod4 {filter:progid:DXImageTransform.Microsoft.BasicImage(Rotation=3);} </style> <script language="javascript"> var num=0; function show(){ num=(num==3)?0:++num alert(num); document.getElementById("img1").style.filter = "progid:DXImageTransform.Microsoft.BasicImage(Rotation=" + num + ")"; } </script> </head>

<body>

<img name="img1" src="images/new/pic_1.gif"> <input type="button" value="90×&ordf;" onclick="show()">

<img src="images/new/pic_1.gif" class="mod1"> <img src="images/new/pic_1.gif" class="mod2"> <img src="images/new/pic_1.gif" class="mod3"> <img src="images/new/pic_1.gif" class="mod4"> </body> </html>

我要举报
如以上回答内容为低俗、色情、不良、暴力、侵权、涉及违法等信息,可以点下面链接进行举报!
点此我要举报以上问答信息
大家都在看
推荐资讯