如何轻松地垂直镜像我的HTML?

时间:2017-04-26 10:18:30

标签: html css reactjs

我现在正在国际网站上工作,其中一种语言是阿拉伯语。由于阿拉伯文化,整个界面必须垂直镜像(显然是翻转边,而不仅是文字方向)。

我已经尝试在容器上使用transform: rotateY(180deg)的技巧,在每个子节点上使用transform: rotateY(180deg),但是我的界面完全没有问题。尝试transform: scale(-1, 1)得到相同的结果。 backface-visibility: visible已添加到文档的每个节点。

您是否知道如何在不编写单独的样式表和其他痛苦的事情的情况下镜像网站界面?

好的,我刚刚在这里重新创建了我的问题,也许这可以提供帮助:https://jsfiddle.net/z7ksof29/3/

1 个答案:

答案 0 :(得分:0)

对我而言,这是有效的:

html {
   -moz-transform: scaleX(-1);
   -o-transform: scaleX(-1);
   -webkit-transform: scaleX(-1);
   transform: scaleX(-1);
   filter: FlipH;
   -ms-filter: "FlipH";
}