我想使用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查找具有空属性的元素,并添加一个可以设置样式的类.>如果您可以修改服务器端代码以不同方式输出该属性,那么这是一个更容易的路径.