Question

我目前正致力于从右到左布局本地化我们的网站。我们有数字，其中每三位数用单引号分隔，例如-1＆＃39; 190.55。在rtl中，这个数字应该是1＆＃39; 190.55-。但是当放置方向时：rtl＆＃39;对于样式，数量变为190.55＆＃39; 1-。数字是动态放置的，不能手动切割。

HTML：

<div>-1'190.55</div>

CSS：

div { direction: rtl }

Answer 1

这可以通过在div中放置一个span来实现。因此，如果您可以更改HTML，那么建议您这样做注意：将减号放在跨度之外。

＆＃13;

div {
  direction: rtl
}

div span {
   unicode-bidi:embed; direction:ltr;
}

＆＃13;

<div>-<span>1'190.55</span></div>

＆＃13;

如果您无法更改HTML，但可以使用JavaScript，那么它也是可能的，尽管这种方式更加复杂。

＆＃13;

var divs = document.getElementsByTagName('div');
for (var i = 0; i<divs.length; ++i) {
  var content = divs[i].innerHTML, min = content.indexOf('-')==0 ?1 :0;
  divs[i].innerHTML = content.substring(0,min)+'<span>'+content.substring(min)+'</span>';
}

＆＃13;

div {
  direction: rtl
}

div span {
   unicode-bidi:embed; direction:ltr;
}

＆＃13;

<div>-1'190.55</div>

＆＃13;

希望这有帮助！

Answer 2

如果您的标记具有灵活性，请尝试使用<span>

在<div>内添加direction:ltr

＆＃13;

div {
  direction: rtl
}
span{
display: block;
direction: ltr;
text-align: right;
}

＆＃13;

<div><span>-1'190.55<span></div>

＆＃13;

方向rtl中带撇号的数字

2 个答案: