结合 LTR 和 RTL 内容改变负数的方向

Question

这是我的 HTML 结构：

div{
  direction: rtl;
}

span{
  direction: ltr;
}

<div>
  <span>امروز -2</span>
  </div>

这是预期结果：

如您所见，- 符号应该出现在数字的开头。我该怎么做？

注：div的方向应该是rtl.

ٍ编辑： 我生成的数字是这样的：

$sums_value = sprintf("%+d",$sums_value);

/* 
sums_value = -2 //=> -2
sums_value = 2  //=> +2

所以数字格式正确，但我不知道为什么它会在输出中被破坏：

Answer 1

您可以使用 before pseudo element 添加连字符。

q::before { 
  content: "-";
  color: blue;
}


<q>Some quotes</q>, he said.

将呈现为

-Some quotes, he said.

Answer 2

由于您的屏幕截图在不同的 span 元素中包含“-2”，您可以在该特定范围内使用 unicode-bidi 选项：

div{
  direction: rtl;
}

span{
  direction: ltr;
  unicode-bidi: bidi-override;
}

<div>
  امروز 
  <span>-2</span>
</div>

The general idea of unicode-bidi is to have the ability to change the default behavior of directionality of the text where you have multiple languages on the same page.

由于您使用的是 RTL 语言，并且您希望 -2 出现在 LTR 中，因此 unicode-bidi: bidi-override 非常方便。

Answer 3

以下对我有用：

span {
  unicode-bidi: plaintext;
}

更多信息：https://developer.mozilla.org/en-US/docs/Web/CSS/unicode-bidi

顺便说一下，'bidi' 是双向的缩写。

结合 LTR 和 RTL 内容改变负数的方向

Change direction of negative number with combination of LTR and RTL content

html

css

bidi