CSS 数据属性中的 .0 小数

发布于 2025-01-15 15:51:11 字数 782 浏览 3 评论 0原文

希望在以下方面得到一些帮助。

代码需要根据输入的变量隐藏项目。例如下面的值在 4 到 4.9 之间。因此，此代码的前 2 行完美地结合在一起以实现此目的，但是如果输入数字 4 作为 4.0，它将应用十进制数字的变量。

这是我尝试让小数 (.1 - .9) 做一件事而让整数 (4) 和 (4.0) 做另一件事。

目前，代码的第 2 行和第 3 行发生冲突，并且都不起作用。任何有关如何解决此问题或编写此代码的更好方法的帮助将不胜感激。

谢谢

[data-customer-rating="4"].review-card__stars .review-card__stars__star-o:nth-of-type(n+8) {display: none:}
[data-customer-rating="4."].review-card__stars .review-card__stars__star-o:nth-of-type(n+9) {display: none:}
[data-customer-rating="4.0"].review-card__stars .review-card__stars__star-o:nth-of-type(n+8) {display: none:}
.review-card__stars .review-card__stars__star-half-empty {display: none;}
[data-customer-rating*="."].review-card__stars .review-card__stars__star-half-empty {display: flex;}

原文

hoping for some help with the following.

The code needs to hide items depending on the variable entered. For example below is between 4 and 4.9. So the top 2 lines of this code combine perfectly to achieve this, however if the number 4 is entered as 4.0 it applies the variables for decimal numbers.

This is my attempt to have the decimals (.1 - .9) do one thing will have whole number (4) and (4.0) do another.

At the moment lines 2 and 3 of the code conflict and neither works. Any help on how to fix this or a better way to write this code would be appreciated.

Thanks

[data-customer-rating="4"].review-card__stars .review-card__stars__star-o:nth-of-type(n+8) {display: none:}
[data-customer-rating="4."].review-card__stars .review-card__stars__star-o:nth-of-type(n+9) {display: none:}
[data-customer-rating="4.0"].review-card__stars .review-card__stars__star-o:nth-of-type(n+8) {display: none:}
.review-card__stars .review-card__stars__star-half-empty {display: none;}
[data-customer-rating*="."].review-card__stars .review-card__stars__star-half-empty {display: flex;}

分享到QQ

分享到微博