使用CSS中的正则表达式隐藏文本，是否可能？

Question

是否可以在css中使用常规exprssions来有选择地隐藏文本？

我有一些文字

Product Pack: pack of 50 +£20.00

我希望显示删除的monetry数量

Product Pack: pack of 50

我可以向CSS添加一个正则表达式吗？

Answer 1

正则表达式不能用于CSS;要完成您要执行的操作，您需要使用javascript（支持正则表达式）或在服务器端处理HTML。

<小时/> 您也可以使用CSS选择器和一些HTML;如果你可以像这样围绕你的金钱领域：

<span>Product Pack: pack of 50 <span class="money">+£20.00</span></span>

您可以编写以下CSS来隐藏货币化值：

.money {
    display: none;
}

Answer 2

CSS规则适用于DOM元素。 文本的一部分本身不是DOM树上的单独元素， 因此不能有单独的风格适用。

但是，您可以轻松处理后端的文本，并在要突出显示的文本周围插入适当分类的SPAN，并将样式应用于这些类。

E.g。退出后端处理后，您的HTML将显示为：

<SPAN class="label">Product Pack</SPAN>: pack of <SPAN class="amount">50</SPAN> <SPAN class="price">+£20.00</SPAN>

（这是使用一些易于编写的RegExp实现的，无论你的后端语言是什么）

然后将CSS应用于这3个类

当然，限制是页面是动态生成的或预先生成的，如果它是静态HTML，或者您需要通过JS加载（我个人更喜欢后端解决方案，如果我实现它） ）