在 CSS 中根据方向设置字体

Question

我正在使用Wordpress。

是否可以为 RTL 文本和标题设置字体系列（

我没有使用 WPML 或 Polylang，只是右对齐并用阿拉伯语书写的文本），与我的主题用作默认值的字体系列不同？ 即。 保留我的模板的默认英语字体，但对文本和标题使用不同的字体（h1， h2...向右对齐（或用阿拉伯语和希伯来语等 RTL 语言书写）。

如何使用主题的样式或自定义 css .css执行此操作？

谢谢。

Answer 1

这很棘手，这实际上取决于您到底想要实现什么以及如何实现。但是，您可以利用 RTL 块（和内联文本）使用 dir="rtl" 属性来设置捕获具有这些属性的元素的常规 CSS 规则。

例如：

<h1 dir="rtl">עברית</h1>

然后添加如下所示的 CSS 规则：

*[dir="rtl"] {
  font-family: serif;
}

这并不完美，您可能需要进行一些调整，但它至少可以解决问题。你需要确保所有的RTL文本都是用dir="rtl"定义的——无论如何，这是一个很好的做法，W3C的建议是什么。

您可以检查此jsfiddle作为示例（我在规则中添加了颜色以显示它如何影响相关的RTL片段）。