html水平翻转效果,html – CSS反转整个网站(镜像效果)

可以像你描述的那样完全翻转整个网站,但是这里有几行CSS：

http://jsbin.com/aduqeq/5/edit

CSS：

body {

margin: 0 auto;

width: 300px;

-moz-transform: scaleX(-1);

-o-transform: scaleX(-1);

-webkit-transform: scaleX(-1);

transform: scaleX(-1);

filter: FlipH;

-ms-filter: "FlipH";

}

但是这种方法有一些缺点：

1)虽然它在Firefox Chrome中运行良好,但它只在IE8中运行(在IE中我的文字看起来很奇怪)期望支持有点不完整(这是一个新的CSS3功能)

2)这里有明显的语义缺点

3)有些人似乎对供应商前缀有所了解

总体而言,在身体上使用RTL并使用不同的样式表可能是一个更好的选择,甚至认为它对你来说更麻烦,最终用户提供了更好的体验(不幸的是,我们想要的快速修复并不总是可用)