Html 在文本前面添加字符（使用CSS）

好的，我有一个CSS代码，它根据货币值改变颜色：

td[数据货币金额]：之后，
td[数据货币金额^=“+”]{
内容：attr（数据货币金额）；
颜色：绿色；
}
td[数据货币金额^=“-”]：之后{
颜色：红色；
}

和HTML：

上面的代码非常有效

我要做的是添加文本字符：↑ 及↓ 根据+和-

这些字符应添加在“+”—”前面

因此，输出应为：

↑+二十三

↓-二十

我试过：

td[数据货币金额]：之后，
td[数据货币金额^=“（+”]，
td[数据货币金额^=“+”]{
内容：attr（数据货币金额）；
颜色：绿色；
内容：“↑";
}

但它不起作用

我知道我在某处犯了个错误

---

需要帮助。

请在选择之前查看pseudo：

---

您可以使用它来更改样式和内容，内容是您插入这些字符的方式（例如，使用它们的html代码）。

在选择前检查伪字符：

---

您可以使用它来更改样式和内容，内容是如何插入这些字符（例如，使用它们的html代码）。

您可以使用伪

：before

和

：after

选择器。 查看下面的解决方案

td[数据货币金额]：之后，
td[数据货币金额^=“+”]{
内容：attr（数据货币金额）；
颜色：绿色；
}
td[数据货币金额^=“+”]：之前{
内容:'↑';
}
td[数据货币金额^=“-”]：之后{
颜色：红色；
}
td[数据货币金额^=“-”]：之前{
内容:'↓';
颜色：红色；
}

---

您可以使用伪

：before

和

：after

选择器。 查看下面的解决方案

td[数据货币金额]：之后，
td[数据货币金额^=“+”]{
内容：attr（数据货币金额）；
颜色：绿色；
}
td[数据货币金额^=“+”]：之前{
内容:'↑';
}
td[数据货币金额^=“-”]：之后{
颜色：红色；
}
td[数据货币金额^=“-”]：之前{
内容:'↓';
颜色：红色；
}

---

这里是绝对解决方案

// for arrow up

td[data-monetary-amount]:after,
td[data-monetary-amount^=" (+"],
td[data-monetary-amount^="+"] {
   content: "\2191 "attr(data-monetary-amount);
   color: green;
}


// for arrow down

td[data-monetary-amount]:after,
td[data-monetary-amount^=" (-"],
td[data-monetary-amount^="-"] {
   content: "\2193 "attr(data-monetary-amount);
   color: red;
}

---

这里是绝对解决方案

// for arrow up

td[data-monetary-amount]:after,
td[data-monetary-amount^=" (+"],
td[data-monetary-amount^="+"] {
   content: "\2191 "attr(data-monetary-amount);
   color: green;
}


// for arrow down

td[data-monetary-amount]:after,
td[data-monetary-amount^=" (-"],
td[data-monetary-amount^="-"] {
   content: "\2193 "attr(data-monetary-amount);
   color: red;
}

---

谢谢，找到答案。没问题，如果是这样的话，请考虑把它标记为正确答案，以便将来的搜索者也会受益。谢谢，找到答案。没问题，如果是这样，请考虑把它标记为正确答案，以便将来的搜索者也会受益。