css
主页 > 网页 > css >

css实现图片旋转功能的代码

2025-02-11 | 佚名 | 点击:

一 css实现图片旋转90度

1

2

3

4

.icon{

  -moz-transform:rotate(-90deg);

  -webkit-transform:rotate(-90deg);

}

 二 水平翻转

1

2

3

4

5

6

7

8

9

.icon {

    color: #f64e78;

    font-size: 20px;

    display: inline-block;

    -moz-transform:scaleX(-1);

    -webkit-transform:scaleX(-1);

    -o-transform:scaleX(-1);

    transform:scaleX(-1);

}

三 垂直翻转

1

2

3

4

5

6

7

8

9

.icon {

    color: #f64e78;

    font-size: 20px;

    display: inline-block;

    -moz-transform:scaleY(-1);

    -webkit-transform:scaleY(-1);

    -o-transform:scaleY(-1);

    transform:scaleY(-1)

}

四 效果图

原文链接:
相关文章
最新更新