根据CSS项的值来设置CSS项的样式

前端之家收集整理的这篇文章主要介绍了根据CSS项的值来设置CSS项的样式前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个百分比列表,范围从0%到200%.

有没有办法根据它们的价值来设置这些数字的样式,即将数字设为0% – 100%为绿色,数字为101%>红色?

请注意,我没有访问HTML的权限,只有CSS.

提前致谢,

汤姆珀金斯

编辑:

有问题的HTML内容如下:

<td class="HtmlGridCell" colspan="5" align="Left"> </td>
    <td class="HtmlGridCell" colspan="2" align="Left"><span class="progress" title="303%"><span class="indicator warning" style="width: 100%;"> </span></span></td>

CSS读取:

@-moz-document url("https://customstudio.workflowmax.com/job/joblist.aspx") {
.progress:after {
content: attr(title);
font-size: 14px;
position: relative;
left: 122px;
top: -27px;
float: left;
color: #666;
background-color: #efefef;
-moz-border-radius: 4px;
padding: 5px;
border: 1px solid #cfcfcf;
font-family: "Helvetica Neue",Arial,Helvetica,Geneva,sans-serif;
}

希望有所帮助.

解决方法

如果你可以设置百分比< 100%以0开始,如099%,你可以使用attr开头,和attr equals选择器.适用于现代浏览器,即7
.progress[title^=1],.progress[title^=2] { background: red; } /* Starts with 1 or 2*/
 .progress[title^=0],.progress[title=100%],{ background: green; } /* Starts with 0 or is 100% */

或者你可以为你拥有的所有200个奇怪的变种做一个选择器,这是很长的啰嗦

猜你在找的CSS相关文章