利用css使得img图片水平或垂直翻转

水平翻转：

<img src="" alt="" style="transform: rotateY(180deg); ">或

<img src="" alt="" style="transform:scaleX(-1); ">

垂直翻转：

<img src="" alt="" style="transform: rotateX(180deg);">或

<img src="" alt="" style="transform:scaleY(-1);">

---

兼容浏览器写法：

水平翻转

<img src="xxx" alt="" style="-moz-transform:scaleX(-1);    

-webkit-transform:scaleX(-1);   

 -o-transform:scaleX(-1);  

  transform:scaleX(-1);  

filter:FlipH;">

垂直翻转：

<img src="xxx" alt="" style="  -moz-transform:scaleY(-1);

  -webkit-transform:scaleY(-1);

  -o-transform:scaleY(-1);

  transform:scaleY(-1);

  filter:FlipV;">

filter:FlipH和filter:FlipX是兼容IE的写法

---

-moz代表firefox浏览器私有属性；

-ms代表IE浏览器私有属性；

-webkit代表chrome、safari私有属性；

-o代表Opera私有属性。