根据rtl或ltr语言自动设置方向和文本对齐 [英] Automactially set direction and text-align based on rtl or ltr languages
问题描述
我们可以为 body 标签设置 direction 属性，以指示 rtl 到 ltr 的方向.同样，我们可以为单个元素设置 text-align 属性.
We can set direction property for body tag to instruct direction either rtl to ltr. Similarly we can set text-align properties for individual elements.
是否有任何方法可以最小化或集中化编码工作，以设计可同时支持 LTR (英语)和 RTL (阿拉伯语)语言的应用程序.可以，我可以为两个方向分别编写CSS，但是在这些CSS之间进行切换的最佳方法是什么(例如，在母版页加载事件中)?
Is there any way to minimize or centralize coding efforts to design an application which can support both LTR(English) and RTL(Arabic) languages.
Its OK, I can write separate css for both directions, but what could be the best way to switch between these css(e.g, in master page load event)?
还有一种例外情况，例如在英语中，我需要网格的第一列显示为 text-align:left (它包含文本)，但是其余的列应显示为 text-align:left ，因为该列包含数字值.同样，阿拉伯语的情况则相反.
There also comes an exceptional case, like in English language I need first column of grid to display as text-align:left (it contains text), but remaining columns should be display with text-align:left, because that columns contains numeric values. Similarly the case will be reverse for Arabic language.
推荐答案
您可以将< body> 下的元素定位为目标，将方向设置为特定值，例如:
You can target elements under <body> where direction is set to a specific value like so:
body span { text-align: left } /* default value */
body[direction="rtl"] span { text-align: right } /* override for rtl languages */
但是，如果您有很多使用text-align的元素，这可能会很烦人.也许您可以使用相同的方法为 text-align 创建一个类:
However if you have a lot of elements using text-align, this can get tiresome. Perhaps you could make a class for text-align using the same method:
.aligned { text-align: left }
body[direction="rtl"] .aligned { text-align: right }
最后，对于更复杂的情况，您可能会发现 RTLCSS 有用:
Finally, for more complex situations you may find RTLCSS useful:
RTLCSS是用于转换从左到右(LTR)级联的框架样式表(CSS)到从右到左(RTL).
RTLCSS is a framework for converting Left-To-Right (LTR) Cascading Style Sheets(CSS) to Right-To-Left (RTL).
这篇关于根据rtl或ltr语言自动设置方向和文本对齐的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
