为什么在方向开头呈现尾随标点符号:rtl?

时间:2013-12-27 10:04:40

标签: html css right-to-left

这更像是一种好奇心。在处理多语言Web应用程序时,我注意到在块元素末尾的某些字符(如标点符号(!?。;,))被渲染为好像它们被放置在开头而不是写入方向是从右到左(因为我不会说某些亚洲语言的情况)。

换句话说,字符串

Hello, World!

呈现为

!Hello, World

放置在具有direction: rtl

的div块中

如果文本被分成两部分并给出不同的颜色,这就变得更加明显:最后一个连续的文本块呈现在两个分开的区域中:

http://jsfiddle.net/22Qk9/

这种行为有什么意义?我想这必须是(所有?)从右到左语言的特性,这是由浏览器自动处理的,所以我不需要关心它,或者我应该吗?

4 个答案:

答案 0 :(得分:21)

如果要修复此行为,最后添加LRM字符‎。它是一个非打印字符。

来源:http://dotancohen.com/howto/rtl_right_to_left.html

示例:http://jsfiddle.net/yobjj6ed/

答案 1 :(得分:20)

原因是感叹号“!”的BiDi类为ON [Other Neutrals],这意味着它有效地适应周围文本的方向性。在示例的情况下,它放在它之前的文本的左侧。这对于从右到左书写的语言非常正确:终止标点符号出现在 end ,即左侧。

通常情况下,您使用CSS代码direction: rtl或最好使用HTML属性dir=rtl来处理从右到左编写的语言中的文本,并且仅针对它们。对他们来说,这种行为是一种解决方案,而不是问题。

如果您仅使用direction: rtldir=rtl来表示特殊效果,例如将表格列从右到左排列,那么您需要考虑其含义。例如,在表格的情况下,您需要为表格的每个单元格设置方向ltr(除非您希望它们主要从右侧到左侧文本呈现)。

如果您在阿拉伯语文本块中引用了英语句子,则需要将包含英语文本的元素的方向性设置为ltr,例如

<blockquote dir=ltr>Hello, World!</blockquote>

在W3C文档What you need to know about the bidi algorithm and inline markup中讨论了一个类似的案例(仅使用阿拉伯语内的英文文本)(虽然有一些奇怪之处,就像对引用文本使用cite标记一样,反对W3C建议。)

答案 2 :(得分:2)

如果您可以控制值的标记/ CSS,并且无法控制HTML,则可以接受接受的答案https://stackoverflow.com/a/20799360/477420

如果您不知道页面将被呈现为RTL还是LTR,但是某些文本肯定是LTR(即仅英语),则可以使用LRE / PDF标记包装该值,以表示该区域是LTR区域。不管页面的LTR或RTL方向如何,文本都会以LTR呈现。

当您有一些代码尝试呈现文本而无法更改标记在页面上显示的准确度时,此方法有效。即您无法在某些嵌套子组件(或服务器端)中为“歌曲块”或“公司名称”字段呈现值,而无法控制周围的HTML元素。

此方法和类似方法(如本问题中的LRM proposal)的一个缺点是在文本上添加标记,即从生成的HTML页面中复制粘贴该值,通常会保留这些标记,但它们不可见/为零。宽度。在大多数情况下,可以考虑这是否对您造成问题。

近似的示例代码(在RTL页面上按原样呈现时,某些公司的末尾带有“ Inc.”,并在结尾处以点号结尾)。

 // comanyName = "Alphabet Inc." - really likes dot at the end including RTL
 if(stringIsDefinitelyAscii(companyName))
 {
     companyName = "\u202A" + companyName + "\u202C"
 }
 return companyName;

有关LRE / PDF符号的详细信息,请参见https://unicode.org/reports/tr9/#Explicit_Directional_Embeddings

  

LRE U + 202A从左向右嵌入     将以下文本视为从左到右嵌入。

     

PDF U + 202C POP方向格式结束最后一个LRE,RLE,RLO或LRO的范围。

可以在How to detect whether a character belongs to a Right To Left language?JavaScript: how to check if character is RTL?How to detect if a string contains any Right-to-Left character?中找到一些确定字符串是否具有RTL字符的方法。

答案 3 :(得分:1)

这只是为什么会发生这种情况的猜测。

我的猜测是direction: rtl属性会增加“双向性”现象,它也会影响标点符号。这用于阿拉伯语或希伯来语脚本,其中相关的标点符号被移动到行的开头。

来源:http://www.w3.org/TR/2013/WD-css-writing-modes-3-20131126/#text-direction

但为什么这个词最后?

我的猜测是,这个unicode不被视为受影响的受支持语言之一。

<强> jsFiddle

正如您所见,阿拉伯文字确实生效


所以这是因为它原本是用于阿拉伯语,希伯来语或任何其他“混合语言”,它只将最后一个标点符号视为支持的UNICODES之一,因为单词本身不是支持的单词之一语言UNICODE。