CSS Selector(如果不为null)+嵌套

时间:2014-08-18 07:36:17

标签: html css nested css-selectors

我正在寻找像

这样的东西
.class[height!= "0"] .span

每次我尝试嵌套像

这样的东西

div.item.class[height="0"]它不起作用。

也许有人可以帮助我? :)

以下是更多代码:

HTML

<div class="barWrapper">
                                        <ul id ="tabs" class="nav-bar" data-tabs="tabs">
                                            <li class="speed" style="height: 0%;"><a href="#Riesenslalom" data-toggle="tab"><span></span></a></li>
                                            <li class="speed" style="height: 0%;"><a href="#Speed" data-toggle="tab"><span></span></a></li>
                                            <li class="mixrace act" style="height: 100%;"><a href="#Mix_Race" data-toggle="tab"><span></span></a><em>1056</em></li>
                                            <li class="mixrace act" style="height: 5%"><a href="#Freeride" data-toggle="tab"><span></span></a><em>5</em></li>
                                            <li class="mixrace act" style="height: 70%"><a href="#Foto_Rallye" data-toggle="tab"><span></span></a><em>539</em></li>
                                            <li class="mixrace act" style="height: 10%"><a href="#Slalom" data-toggle="tab"><span></span></a><em>20</em></li>
                                            <li class="speed" style="height: 0%"><a href="#Buckelpiste" data-toggle="tab"><span></span></a></li>
                                            <li class="speed" style="height: 0%;"><a href="#Flug" data-toggle="tab"><span></span></a></li>
                                            <li class="mixrace act" style="height: 90%"><a href="#Carving" data-toggle="tab"><span></span></a><em>800</em></li>
                                            <li class="mixrace act" style="height: 100%"><a href="#Wandern" data-toggle="tab"><span></span></a><em>1200</em></li>
                                            <li id="line"></li>
                                        </ul>   
                                    </div>

CSS

div.item.topStatistic .topStatistic-content .first .left .statisticWrapper .barWrapper ul > li span{position:absolute; bottom:0; width: 100%; height:40px; text-align: center; }
div.item.topStatistic .topStatistic-content .first .left .statisticWrapper .barWrapper ul > .speed span{background: url("icon_statistic_Speed.png") no-repeat transparent;}
div.item.topStatistic .topStatistic-content .first .left .statisticWrapper .barWrapper ul > .mixrace:not([height=0]) span{background: url("icon_statistic_active_MixRace.png") no-repeat transparent;}

2 个答案:

答案 0 :(得分:1)

Css将:not()作为伪选择器。所以.class:not([height=0])应该有效。 http://caniuse.com/#search=:not

答案 1 :(得分:1)

你可以使用它会对你有用的伪元素,但问题是,它只适用于不在ie8中的主浏览器并且打击

  

:not()