Question

我有一个Bootstrap v4.0.0模板，它是LTR方向，我想将整个模板更改为RTL Direction，我使用以下方法：

<html dir="rtl">
<body dir="rtl" >
body { direction:rtl; }
html { direction:rtl; }
https://github.com/MahdiMajidzadeh/bootstrap-v4-rtl (bootstrap-rtl.css)

但这些方法无效。

**

完全改变页面方向的最佳方法是什么，如镜子 FLIP HORIZONTAL？（RTL指示）

**

以下CSS代码，它将改变基于页面的方向翻转水平，但之后如何保留它？（请 查看下面的图片）

-moz-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
-o-transform: scaleX(-1);
transform: scaleX(-1);
-ms-filter: fliph; /*IE*/
filter: fliph; /*IE*/

提前致谢

Answer 1

此代码段通过反转水平刻度来水平翻转/镜像页面

.mirror{
  margin: 0 auto;
  -moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH;
  -ms-filter: "FlipH";
  float: right;
}

<div class="mirror">
mirrored text
</div>
<div>
not mirrored
</div>

基于RTL方向的Bootstrap模板 - FLIP HORIZONTAL

1 个答案: