rtl 方向带撇号的数字

Question

我目前正在致力于我们网站的从右到左布局的本地化。我们有每三位数字用单引号分隔的数字，例如-1'190.55。在 rtl 中，该数字应为 1'190.55-。但是当将“direction: rtl”添加到样式中时，数字变为 190.55'1-。这些数字是动态放置的，无法手动剪切。

HTML：

<div>-1'190.55</div>

CSS：

div { direction: rtl }

Answer 1

通过在 div 中放置一个跨度，这是可能的。因此，如果您可以更改 HTML，那么这是推荐的方法。
注意：将减号放在跨度之外。

div {
  direction: rtl
}

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

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

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

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>';
}

div {
  direction: rtl
}

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

<div>-1'190.55</div>

希望这可以帮助！