CSS属性选择器:如果自定义属性有值,则应用类?此外,它会在IE7中工作吗?

前端之家收集整理的这篇文章主要介绍了CSS属性选择器:如果自定义属性有值,则应用类?此外,它会在IE7中工作吗?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想使用CSS属性选择器将类应用于某些跨度,但前提是它们有内容.我有一个自定义属性,如果span包含内容,则只有一个值:“entityvalue”.使用下面的CSS时,它不会将类应用于任何元素,即使entityvalue =’1634’在HTML中也是如此.
.ApplicationName[entityvalue="*"]  {
                 display: inline;
                 background-image: url("../images/icon_application.PNG");
                 background-repeat: no-repeat;
                 background-position: left;
                 padding-left: 12px;
                 }

我试过在某些网站上找到.ApplicationName [entityvalue!=“”],但显然它不符合CSS标准(在Chrome中不起作用),真的很糟糕,因为.ApplicationName [entityvalue =“”]完全相反我需要的…

以下是span / div WITH内容(应该设置样式)和span / div WITHOUT内容(不应该设置样式)的示例:

<div class="ApplicationName Redirect" entitytype="Application" entityvalue=""></div>

<div class="ApplicationName Redirect" entitytype="Application" entityvalue="1234">Microsoft Outlook</div>

解决方法

省略值部分:
.ApplicationName[entityvalue]

这适用于IE7.

如果你对于将entityvalue设置为空虚感到偏执,并且你不想包含这些元素:

.ApplicationName[entityvalue]:not([entityvalue=""])

这不适用于IE7.

如果您确实需要迎合这一点,那么您有一些选择:

>为.ApplicationName [entityvalue =“”]定义覆盖/重置样式,因此您有一个规则与上面的第一个选择器,另一个规则与此一个.>使用JavaScript查找具有空属性的元素,并添加一个可以设置样式的类.>如果您可以修改服务器端代码以不同方式输出属性,那么这是一个更容易的路径.

猜你在找的CSS相关文章