如何在“direction”段落中强制一段文本为“direction”

Question

因此，电话号码始终是ltr (从左到右)。

在一个多语言网站上工作，我需要在一个文本段落中插入一个电话号码(前缀为'+‘，数字以’-‘分隔)，这个段落的方向是rtl (当然是相关语言)

所以我有这样的东西：

​

.ltr #test {direction:ltr}
.rtl #test {direction:rtl}
#phone {direction:ltr}

<div class="ltr"><p id="test">Please call to <span id="phone">+44-123-321</span> for some help.</p></div>
<div class="rtl"><p id="test">Please call to <span id="phone">+44-123-321</span> for some help.</p></div>

​

当然这是行不通的，因为'direction‘只适用于块元素，而'span’是一个内联元素。我需要把电话号码放在段落里，这样我就不能把'span‘改成'display:inline’

我说得够清楚了吗？

如何让它工作？

Answer 1

您可以在+符号之前使用unicode方向性标记字符，为算法提供所需的提示。

它们是：

LTR: 0x200E
RTL: 0x200F

所以：

​

<p id="text">Please call to <span id="phone">&#x200F;+44-123-321</span> for some help</p>

​

请参阅this，以便回答更多详细信息。

Answer 2

尝试添加#phone {direction:ltr; display:inline-block}

Answer 3

另一种选择是在你的内联元素中使用dir='ltr'属性：

<p id="text">Please call to <span dir='ltr'>+44-123-321</span> for some help</p>

请注意，在HTML中包含‎与使用dir='ltr'属性一样糟糕。