为什么“[x] y”在RTL方向上显示不正确?

时间:2017-05-15 07:05:28

标签: html css right-to-left

<div style="direction: rtl">
[x]y
</div>

您可以看到HTML文字[x]y显示为x]y]

该结果的原因是什么?

PS:我在Chrome 56.0.2924.87(64位)中得到了这个结果。

5 个答案:

答案 0 :(得分:32)

我无法告诉你原因,但我可以告诉你如何解决它:添加unicode-bidi: bidi-override;。请参阅more关于它

&#13;
&#13;
<div style="direction: rtl; unicode-bidi: bidi-override;">
[x]y
</div>
&#13;
&#13;
&#13;

描述

  

unicode-bidi属性与direction属性一起用于设置或返回是否应覆盖文本以支持同一文档中的多种语言。

不足以解释这种行为。但是,它有效。

修改

The MDN article带来了一些亮点,bidi-override实际上禁用了浏览器标准的智能行为,一切都按预期工作。

答案 1 :(得分:26)

正确呈现,即根据规格。您已经要求从右到左布局。渲染首先采用[字符。它是方向中性的,因此在最右边的RTL运行中呈现并镜像(因此它看起来像])。接下来,它左边是x]y的顺序,因为拉丁字母xy具有固有的从左到右的方向性,而中性]得到了它他们的方向性。
要绘制的结论取决于您想要的渲染以及使用从右到左方向性的原因。

答案 2 :(得分:17)

经过一些研究,我发现了the following 信息:Right-To-Left text direction

  

括号和方括号没有固有的方向。左括号是在LTR和RTL文本运行之间,因此不能“继承”周围文本的方向。因此,它默认为段落的RTL基本方向,并且位于希伯来语单词shalom的左侧。请注意,结束方括号嵌入在从左到右文本的单个运行中。因此它采用其周围文本的方向,并位于英文单词shalom的右侧。

答案 3 :(得分:1)

其中一个解决方案是在括号

之后添加 &#x200e;

感谢@freeworlder提供的解决方案 brackets displays wrongly for right to left display style

即使您可以使用其他字符,请点击此链接 http://www.codetable.net/hex/200e

答案 4 :(得分:0)

尝试使用方括号“[”,您需要一个封闭的方括号,反之亦然。我有一个字母,字母映射到“[”,它不会显示。我将数据库中的字母改为“]”并且它有效。