gpt4 book ai didi

CSS - rtl 元素中的方向 ltr

转载 作者:技术小花猫 更新时间:2023-10-29 11:28:12 27 4
gpt4 key购买 nike

标记是这样的:

<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/

最佳答案

问题似乎是在从右到左的上下文中,<code>some:code;</code>显示为 ;some:code (即,分号出现在左侧,而不是右侧)即使 direction设置为 ltrcode 上元素。

三个备选方案,按优先顺序排列:

1) 使用 dir code 的 HTML 属性元素(以及其他在从右到左环境中包含从左到右文本的元素):

<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 属性(property)。请注意,HTML5 CR 强调 says : “强烈建议作者使用 dir 属性来指示文本方向而不是使用 CSS,因为这样即使没有 CSS,他们的文档也能继续正确呈现。”

解决方案 3 是在字符级别执行相同操作的另一种方法。在大多数情况下,您还可以从左到右标记字符(在开始和结束处),但此处使用的字符是 CSS 2.1 建议的与 unicode-bidi: embed 对应的字符。 . HTML 4.01 提到了方向性控制字符,但补充说:“标记方法提供了更好的文档结构完整性保证,并减轻了使用简单的文本编辑器编辑双向 HTML 文本时的一些问题,但某些软件可能更适合使用 [UNICODE]人物。如果同时使用这两种方法,则应格外小心,以确保正确嵌套标记和定向嵌入或覆盖,否则,渲染结果是不确定的。”

关于CSS - rtl 元素中的方向 ltr,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21090956/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com