对于从右到左的显示样式，括号显示错误

发布于 2024-11-02 15:51:02 字数 424 浏览 8 评论 0原文

html 代码

<html dir="rtl">
<p>hello (world)</p>
</html>

你会看到这样的页面：

(hello (world

但是，如果我将 html 代码更改为

<html dir="rtl">
<p>hello (world) again</p>
</html>

那么文本显示正常：

 hello (world) again

任何人都可以解释为什么会发生这种情况？如何修复第一个示例？

我的浏览器是chrome

原文

The html code

<html dir="rtl">
<p>hello (world)</p>
</html>

you will see a page like this:

(hello (world

However，if I change the html code into

<html dir="rtl">
<p>hello (world) again</p>
</html>

Then the text displays normally:

 hello (world) again

Anyone can explain why this happens?
How to fix the first example?

My browser is chrome

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

放低过去 2024-11-09 15:51:02

您只需在最后一个括号后面添加 LRM 字符即可。 HTML 实体：‎

<html dir="rtl">
<body>
<p>hello (world)‎</p>
</body></html>

这告诉浏览器将括号解释为从左到右阅读。

You just need to add the LRM character after the last bracket. HTML entity: ‎

<html dir="rtl">
<body>
<p>hello (world)‎</p>
</body></html>

This tells the browser to interpret the brackets as left-to-right reading.

回复收藏 0 原文

不念旧人 2024-11-09 15:51:02

或者更好的是你可以尝试使用CSS

*:after {
    content: "\200E‎";
}

Or better you can try in CSS

*:after {
    content: "\200E‎";
}

回复收藏 0 原文

江心雾 2024-11-09 15:51:02

在元素前后添加 css 中的特殊 rlm 字符解决了我在 Firefox 和 Chrome 中遇到的所有情况：

*:after {
    content: "\200E‎";
}
*:before {
    content: "\200E‎";
}

Adding the special rlm character in css before and after your element solved all cases I've come across in Firefox and Chrome:

*:after {
    content: "\200E‎";
}
*:before {
    content: "\200E‎";
}

回复收藏 0 原文

断爱 2024-11-09 15:51:02

在 ( 之前使用 ‏。
例如：

<html dir="rtl">
<body>
<p>hello ‏(world)</p>
</body></html>

如果您使用 javascript/svg Dom，则

 aText = $('<span>').html(aText.replace("(","‏(")).text();
 $("<p>").html(aText);

对于其他特殊字符

function getRTLText(aText,aChar) {
        if ( aText != undefined && aText.replace){
            aChar = (aChar === undefined )?"(":aChar;
            aText = $('<span>').html(aText.replace(aChar,"‏"+aChar)).text();
        }
        return aText;
}

并调用函数

getRTLText("March / 2018","/");

Use ‏ before (.
Ex:

<html dir="rtl">
<body>
<p>hello ‏(world)</p>
</body></html>

if you are using javascript/svg Dom then

 aText = $('<span>').html(aText.replace("(","‏(")).text();
 $("<p>").html(aText);

for other special Charactors

function getRTLText(aText,aChar) {
        if ( aText != undefined && aText.replace){
            aChar = (aChar === undefined )?"(":aChar;
            aText = $('<span>').html(aText.replace(aChar,"‏"+aChar)).text();
        }
        return aText;
}

and call function

getRTLText("March / 2018","/");

回复收藏 0 原文

愛放△進行李 2024-11-09 15:51:02

这是从右到左文本的正确括号渲染（显然）。本文提供了更多信息。

http://www.i18nguy.com/markup/right-to-left.html

~~dir 属性现已弃用。~~

回复收藏 0 原文

半山落雨半山空 2024-11-09 15:51:02

如果有人在 WordPress 中遇到此问题，您可以尝试以下修复：

https://gist.github.com/dtbaker/ b532e0e84a8cb7f22f26

function dtbaker_rtl_bracket_hack($content){
    if(is_rtl()){
        $content = preg_replace('#<p>([^<]+)\)\s*</p>#','<p>$1)‎</p>',$content);
        $content = preg_replace('#<p>\s*\(([^<]+)</p>#','<p>‎($1</p>',$content);
    }
    return $content;
}
add_filter('the_content','dtbaker_rtl_bracket_hack',100,1);

If anyone has this issue in WordPress you can try this fix:

https://gist.github.com/dtbaker/b532e0e84a8cb7f22f26

function dtbaker_rtl_bracket_hack($content){
    if(is_rtl()){
        $content = preg_replace('#<p>([^<]+)\)\s*</p>#','<p>$1)‎</p>',$content);
        $content = preg_replace('#<p>\s*\(([^<]+)</p>#','<p>‎($1</p>',$content);
    }
    return $content;
}
add_filter('the_content','dtbaker_rtl_bracket_hack',100,1);

回复收藏 0 原文

~没有更多了~