在从右到左的HTML页面中设置从左到右的方向

Question

我正在尝试在一个从右往左的HTML页面中显示负数。

这个标签似乎没有响应我的direction: ltr。

我已经写了一个jsFiddle来展示相反的情况（试图从右到左显示）。

- devmonster

Answer 1

将 unicode-bidi: embed; 添加到您的 CSS 中即可。这样应该就可以解决问题了 - 可以参考更新后的Fiddle

您可以在此处找到用法。

- Henrik Janbell

---

不客气。有一些属性你不太经常用到 :) - Henrik Janbell

这段 jsfiddle 代码将 direction 设置为 rtl。我想你的本意应该是写成 ltr。 - Jukka K. Korpela

不，由于大多数阅读此内容的用户都是从左到右模式，将元素更改为从右到左模式会使示例更加清晰。Devmonster在问题中选择了相同的方法。 - Henrik Janbell

Answer 2

direction: ltr不会将负号放在数字左侧的原因是周围的字符都是从右到左的字符，这使得“中立”字符如数字和减号（或连字符）遵循该方向性。 direction属性 影响盒子的布局方向和相关问题，而不是文本的书写方向。

考虑以下内容：

<p>א <label id="ProfitShk" class="labelVal">-9 ₪</label> ת
<p>a <label id="ProfitShk" class="labelVal">-9 ₪</label> b

在第一种情况下，连字符出现在数字9的右侧，遵循周围文本的书写方向。而在第二种情况下，顺序则相反，因为周围的字符是拉丁字母，具有固有的从左到右的方向性。

这是一个棘手的问题，一些希伯来语页面似乎使用把连字符放在数字后面的技巧，以便在应用从右到左的书写时，连字符出现在数字的左侧。

更恰当的方法是：

1. 在CSS中使用 unicode-bidi: bidi-override，以及 direction。它意味着内容内部固有的方向性被忽略，并应用由 direction 指定的顺序。
2. 在CSS中使用 unicode-bidi: embed，以及 direction。这将在其中创建一个“方向性岛屿”，使周围的文本不会影响方向性。当元素内容仅包含“中性”字符时，direction 属性设置文本方向。
3. 在HTML中使用 <bdo> 元素，带上 dir 属性。这是方法2的HTML对应项，并且更好，因为这不涉及样式呈现建议（这是CSS的任务，并且做得最好），而是关于正确处理方向性中的一些基本问题。
4. 在字符串前后使用从左到右和从右到左标记。它们可以分别表示为HTML中的 ‎ 和 ‏。这将使字符串前的最后一个字符成为从左到右标记，如果它仅包含“中性”字符，则使其显示为从左到右。

这是对一个复杂问题的简化介绍。无论如何，使用 <bdo> 可能是最好的方法。在所有方法中，方向性的设置应该限制在可能的最小字符串上，例如示例中的-9。

<p>א <label id="ProfitShk" class="labelVal"><bdo dir="ltr">-9</bdo> ₪</label> ת

用作减号的字符应该是Unicode减号“−” U+2212 MINUS SIGN，可以在HTML中表示为−，但这不会影响方向性问题。

- Jukka K. Korpela

Answer 3

除了Henrik的回答外，我还会在减号之前添加一个LRM控制字符，如下所示：

<label id="ProfitShk" class="labelVal">&lrm;-9 ₪</label>​​​​​​​​​​​​​​​​​​​​​​

这样，减号就会放在9的前面（这可能是你想要的）

这个微软文档解释了LRM控制字符以及其他控制字符。

- Danield