倒CSS属性改变为RTL

要改变网页CSS是从LTR RTL我必须设置或反转下面的CSS属性：倒CSS属性改变为RTL

体{方向：RTL}

任何浮点数：左应该是浮动：正确，反之亦然关于所留下

任何填充或保证金或权利应得到扭转

另外任何图像应水平反转。

我的问题是：是否还有更多的CSS属性应该改变？

来源

2012-09-05 SaidbakR

为什么你认为图像应该倒置？ *某些图像可能会以某种方式假定从左到右的方向性，但这是一个特例。 –

文本对齐，背景位置，边框位置，左右位置，基本上任何东西都有水平属性。如果你想亲手做，你可以通过一系列的css属性，如this one，但我个人认为使用其中一种在线工具可以开始。 CSSJanus通常都很不错，不过我相信如果你google的话还有更多。

祝你好运。

来源

2012-09-05 15:27:38 Tsubashi

尽管CSSJanus很好，但如果您打算将它用于以下目的，它并不好：您有一个带有原始LTR布局的CSS文件，并且您尝试创建一个带有RTL布局的新CSS文件，该文件应包含在原始文件CSS当用户的lang是RTL时。 CSSJanus不会用'margin-left：auto'覆盖'margin-left：10px'; margin-right：10px'，但是只需添加'margin-right'属性，并且最终同时使用'margin-left'和'margin-right'等于10px。 –

你只是想使用从右到左书写，还是你想镜像的网页？

body { 
    transform: scaleX(-1); 
    -ms-transform: scaleX(-1); 
    -moz-transform: scaleX(-1); 
    -webkit-transform: scaleX(-1); 
    -o-transform: scaleX(-1); 
}

这将产生网页的镜像，但一切仍然有效，因为它应该（链接在新的位置点击，例如）

来源

2012-09-05 15:27:47

你可以试试;

body { 
    -ms-transform: scaleX(-1); 
    -moz-transform: scaleX(-1); /* Gecko */ 
    -o-transform: scaleX(-1); /* Operah */ 
    -webkit-transform: scaleX(-1); /* webkit */ 
    transform: scaleX(-1); /* standard */ 
    filter: FlipH; /* IE 6/7/8 */ 
}

这会产生镜面效果。 Here是一个现场演示。

如果您想从右向左流动字母，并且如果想要将项目浮动到右侧，可以使用text-align: right，您可以尝试rtl。

如果您希望文本从右侧开始，您可以尝试;

body{ 
    unicode-bidi:bidi-override; 
    direction:rtl; 
    float: right; 
}

Here是现场演示;

来源

2012-09-05 15:54:55

另一些属性...

箱阴影和文字阴影

/*由-1 */

`box-shadow: 5px -5px 5px 5px #abc;`

乘以第一值（水平偏移的阴影）成为

box-shadow: -5px -5px 5px 5px #abc;

and

text-shadow: 2px 2px #FF0000;

成为

text-shadow: -2px 2px #FF0000;

2：边界半径

你必须要小心这一个作为改变值达到RTL原理不同位置

border-radius:25px 0px 0 25px; 


becomes 

border-radius:0 25px 25px 0; (not border-radius:25px 25px 0 0;)

此外，这里有一些提示：

水平位置为百分比

如果你有这样一个风格：

.style 
{ 
position: absolute; 
top: 22%; 
left: 32%; 
... 
}

左属性将成为100-32=68%

2.背景位置：表示平价值像素 - 例如：

background-position: -34px -85px;

在这种情况下，您将不得不手动解决这个问题。（见this文章）

作为参考：

这里有一个great article约有关转换一个网站，以RTL

实际上，整个网站http://rtl-this.com涉及RTL问题，所以可以找到很多有用的东西有

来源

2012-09-05 17:08:50 Danield

倒CSS属性改变为RTL

回答

相关问题