Question

标记是这样的：

<html dir="rtl">
    <head>
        <style>
            p {direction: rtl;}
            code{direction: ltr !important;}
        </style>
    </head>
    <body>
        <p>متن به زبان فارسی<code>some:code;</code>متن به زبان فارسی</p>
    </body>
</html>

some word to reach quality of content, ah rules...

但是direction:ltr属性不起作用，有什么方法可以使它工作吗？

请注意，我们无法从html标记中删除dir="rtl"，同时float:left会破坏所有内容！

代码已更新：它无法使用波斯语言 http://jsfiddle.net/cC3FX/4/

Answer 1

问题似乎是在从右到左的上下文中，<code>some:code;</code>显示为;some:code（即分号显示在左侧，而不是右侧），即使direction在ltr元素上设置为code。

三种选择，按优先顺序排列：

1）在HTML中使用dir属性作为code元素（以及从右到左环境中包含从左到右文本的其他元素）：

<code dir=ltr>some:code;</code>

这使code的CSS规则变得多余。

2）在问题中使用CSS代码（虽然那里不需要!important说明符），添加CSS规则

code { unicode-bidi: embed }

3）在code元素内容的末尾使用U + 202A LEFT-TO-RIGHT EMBEDDING和U + 202C POP DIRECTIONAL FORMATTINGC，例如

<code dir=ltr>&#202a;some:code;&#202c;</code>

问题是由Unicode双向性规则引起的。考虑示例<code>some:code;</code>（字面意思），设置direction: ltr是不够的。在从右到左的整体上下文中，方向中性的“;”字符遵循封闭内容的方向性，因此它位于左侧。从某种意义上说，位于LTR和RTL文本之间的交叉点，它被不同的方向，它自己的元素和父元素撕裂，Unicode规则说父母获胜。

解决方案1解决了这个问题，因为HTML dir属性和CSS direction属性之间存在差异，如HTML5 CR第10.3.5节Bidirectional text所示。该属性导致“双向嵌入”，这意味着元素内容在方向性嵌套的新级别上呈现。

解决方案2在CSS中使用unicode-bidi属性执行相同的操作。请注意HTML5 CR着重says：“强烈建议作者使用dir属性来指示文本方向而不是使用CSS，因为即使没有CSS，他们的文档也会继续正确呈现”。

解决方案3是另一种在角色级别做同样事情的方法。在大多数情况下，您也可以使用LEFT-TO-RIGHT MARK字符（在开头和结尾），但这里使用的字符是CSS 2.1建议的unicode-bidi: embed对应字符。 HTML 4.01提到了方向性控制字符，但补充说：“标记方法提供了更好的文档结构完整性保证，并在使用简单的文本编辑器编辑双向HTML文本时缓解了一些问题，但某些软件可能更适合使用[UNICODE]字符。如果使用这两种方法，应特别注意确保正确嵌套标记和方向嵌入或覆盖，否则渲染结果是不确定的。“

Answer 2

您可以添加格式控制字符来修复此双向（Bidi）问题。

添加&lrm;从左到右标记 - 如下：

<p>متن فارسی<code>some:code;&lrm;</code>متن فارسی</p> /* added &lrm; char here */

<强> FIDDLE

有关详细信息，请查看this microsoft article

Answer 3

您的代码运行正常，请查看demo

HTML CODE

<p>some text <code>some:code;</code></p>
some word to reach quality of content, ah rules...

CSS代码

html,body{direction: rtl;}
p {direction: rtl;}
code{direction: ltr !important;}

CSS - rtl元素中的方向ltr

3 个答案: