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

发布于 2024-11-02 15:51:02 字数 424 浏览 4 评论 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

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

扫码二维码加入Web技术交流群

发布评论

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

评论(6

放低过去 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.

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

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

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

Or better you can try in CSS

*:after {
    content: "\200E‎";
}
江心雾 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‎";
}
断爱 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","/");

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

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

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

dir 属性现已弃用。

This is the correct bracket rendering for right to left text (apparently). This article gives a bit more info.

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

The dir attribute is now depreciated.

半山落雨半山空 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);
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文