双向网站CSS样式最佳实践？

Question

我正在开发一个由四种语言组成的网站（阿拉伯语、英语、法语和西班牙语），（阿拉伯语对于不懂的人来说是从右到左的语言）。

基本上从左到右（en、es 和 fr）网站将具有相同的布局/CSS。

为了处理不同的阿拉伯语风格，我想知道两种方法之间的关系：

1.特定语言/方向课程：

将以下类添加到

html

标记，并使用一个简单的文件来处理该问题

在这种情况下，我会使用一个

common.css

文件来处理所有常见的事情，并加载一个单独的特定语言/方向文件（例如

arabic.css

或

western.css

）

您认为最好的选择是什么？

谢谢

Answer 1

选项#2 听起来是更易于管理的解决方案。这样您就可以根据所选语言简单地加载适当的样式表。因为听起来网页中的文本会根据所选语言进行更新（即，它不会实际写出两次），两个单独的样式表将允许您修改布局，而不会弄乱 html 标记中的内容。因此，有关如何切换语言的更多信息可能会帮助您获得更好的答案。

Answer 2

我不太确定为什么你需要阿拉伯语文本的特定课程。好的，您可能想要修改字体（如字体系列或字体大小），但仅此而已。要切换方向性，您应该使用 dir 属性（即 W3C 推荐）。

对于样式元素，如果你确实需要修改每个元素的样式，你可能需要使用通用选择器：

* { font-family: Verdana; }

对于给定语言的元素（如果你记得使用 lang 属性），你还可以将通用选择器与 lang 伪选择器结合使用（注意某些网络浏览器似乎不支持它，尽管从 CSS2 开始就应该支持它） :

*:lang(ar) { font-size: 14px; }

Answer 3

创建双向样式表的一个选项是使用

*-inline-*

CSS 规则。有一个网站可以帮助您将

CSS

代码转换为此类样式，但您不应该更改您的

writing-mode

。