1

I have a list item which when active, gets a class "ui-btn-active" added to it which changes the background to green. however the h2 and p deep in the markup don't change colour. I need to change these to white when this happens.

The following doesn't help:

.ui-btn-active.hot-listing-title {colour: white; }
.ui-btn-active.hot-listing-address {colour: white; }
.ui-btn-active.hot-listing-price {colour: white; }

Any ideas?

     <li itemscope="" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-icon="arrow-r" data-iconpos="right" data-theme="c" class="ui-btn ui-btn-icon-right ui-li-has-arrow ui-li ui-li-has-thumb ui-first-child ui-btn-active ui-btn-hover-c ui-btn-down-c">
            <div class="ui-btn-inner ui-li"><div class="ui-btn-text">
            <a href="#" class="hot-listing-link ui-link-inherit">
                 <img src="ab.jpg" class="hot-listing-image ui-li-thumb">
                 <h2 class="hot-listing-title ui-li-heading">Blah blah</h2>
                 <p class="hot-listing-address ui-li-desc" itemprop="address">Blah Blah</p>
                 <p class="hot-listing-price ui-li-desc">£50,000</p>
            </a>
            </div>
            <span class="ui-icon ui-icon-arrow-r ui-icon-shadow">&nbsp;</span>
       </div></li>
4

2 回答 2

3

您需要在类之间留一个空格来表示后代，我也不知道这是否是拼写错误，但属性名称应该是color

.ui-btn-active .hot-listing-title {color: white;}
.ui-btn-active .hot-listing-address {color: white;}
.ui-btn-active .hot-listing-price {color: white;}
于 2013-08-13T22:35:02.117 回答
1

尝试使用这个：

li.ui-btn-active .hot-listing-title {color: white;}
li.ui-btn-active .hot-listing-address {color: white;}
li.ui-btn-active .hot-listing-price {color: white;}

请参阅示例

于 2013-08-14T00:26:47.930 回答