从右到左显示样式错误地显示括号

时间:2011-04-21 08:31:05

标签: html google-chrome right-to-left

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

6 个答案:

答案 0 :(得分:37)

您只需要在最后一个括号后添加LRM字符。 HTML实体:&#x200E;

<html dir="rtl">
<body>
<p>hello (world)&#x200E;</p>
</body></html>

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

答案 1 :(得分:16)

或者你可以尝试使用CSS

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

答案 2 :(得分:4)

在元素解决所有情况之前和之后,在CSS中添加特殊的rlm字符:

193 194 195 196 197 198 199 187 188 189
193 194 195 196 197 198 199 187 188 189
193 194 195 196 197 198 199 187 188 189
193 194 195 196 197 198 199 187 188 189
193 194 195 196 197 198 199 187 188 189

答案 3 :(得分:1)

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

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

dir属性现已折旧。

答案 4 :(得分:1)

&rlm;之前使用(。 例如:

<html dir="rtl">
<body>
<p>hello &rlm;(world)</p>
</body></html>

如果你正在使用javascript / svg Dom那么

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

其他特殊字符

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

并调用函数

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

答案 5 :(得分:-1)

如果有人在WordPress中遇到此问题,您可以尝试此修复程序:

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

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