为什么我的 CSS 类样式不适用于特定的 <li>？ [复制]

Question

可能重复：
Why is my CSS Class style not applying to specific <li>'s?

回答：这是一个愚蠢的错误，在单行 cmets 中使用 '//' 而不是包裹在 /**/ 中（最近写了太多 javascript）感谢帮助，抱歉浪费时间。

我不明白为什么这个 CSS 不仅仅适用于某些 li 的..

这是 CSS ：（注意它说什么适用和不适用的 cmets - 这很奇怪，因为 facebook 链接确实识别父 li 的类“post-face”并应用链接颜色，但实际li 无法识别编辑或 facebook li 上的课程，但它在 twitter 和评论 li 上使用完全相同的代码）

.SL .post .post-det .post-tweet {
    /* DOES APPLY */
    background: url(images/post-tweet-icon.png) no-repeat left 2px;
}
.SL .post .post-det .post-tweet a { color:#008ebc; } /* DOES APPLY */

/* FACEBOOK SHARE ADDON */
.SL .post .post-det .post-face {
    /* THIS DOESN'T APPLY */
    background: url(images/post-tweet-icon.png) no-repeat left 2px;
}
.SL .post .post-det .post-face a { color:#A1A1A0; } /* THIS DOES APPLY */
/* END FACEBOOK SHARE ADDON */

.SL .post .post-det .post-edit {
    /* THIS DOESN'T APPLY */
    background: url(images/post-edit-icon.png) no-repeat left 2px;
}
.SL .post .post-det .post-edit a { color:#ff0000; } /* THIS DOES APPLY */

这里是 HTML：

<!--start of Latest Posts-->
<div class="latest">
<span class="toptitle"><strong>Latest Post</strong></span>

<div id="post-89" class="post indexpost">
<div class="post-head">
 <div class="post-date">July 6, 2011</div>
  <h2><a href="http://website.com/geo/?p=89" title="Permalink to Get in Touch" rel="bookmark">Get in Touch</a></h2>
 </div>
    <div class="post-con"><p>Geothermal Solutions is proud to serve the Ontario geothermal market for over 5 years installing over 2000 residential systems. We work for HVAC contractors across Ontario. </p> 
<p><a href="http://website.com/geo/wp-content/uploads/2011/07/residential.jpeg"><img class="alignnone size-medium wp-image-112" title="residential" src="http://website.com/geo/wp-content/uploads/2011/07/residential-300x199.jpg" alt="" width="300" height="199" /></a></p> 
<p>With our knowledge and expertise you can have confidence in the loop that is going into the ground and rely on Geothermal Solutions to have it completed in a timely and professional manner. </p> 
<p>We work for many of the major residential ground source installers in Ontario today which trust us for our reputation and quality work they can depend on.</p> 
</div>
 <ul class="post-det">
    <li class="post-tag"><span class="entry-utility-prep entry-utility-prep-tag-links"></span> <a href="http://website.com/geo/?tag=geothermal" rel="tag">geothermal</a> | <a href="http://website.com/geo/?tag=geothermal-energy" rel="tag">geothermal energy</a> | <a href="http://website.com/geo/?tag=green-2" rel="tag">green</a> | <a href="http://website.com/geo/?tag=residential" rel="tag">residential</a></li>
    <li class="post-comment"><a href="http://website.com/geo/?p=89#respond" title="Comment on Get in Touch">Leave a comment</a></li>
<li class="post-tweet"><a href='http://twitter.com/share' class='twitter-share-button' data-url='http://website.com/geo/?p=89' data-text='Get in Touch' data-count='vertical'>Tweet This !</a></li>

  <li class="post-face"><a href='http://facebook.com' class='twitter-share-button' data-url='http://website.com/geo/?p=89' data-text='Get in Touch' data-count='vertical'>Share This !</a></li>  
  <li class="post-edit"><a class="post-edit-link" href="http://website.com/geo/wp-admin/post.php?post=89&amp;action=edit" title="Edit Post">Edit</a></li>  </ul>
 </div>
<!--End of Post -->

</div>
<!--end of Latest Posts-->

Answer 1

试试这个：

.SL .post .post-det .post-tweet {
    /* DOES APPLY */
    background: url(images/post-tweet-icon.png) no-repeat left 2px;
}
.SL .post .post-det .post-tweet a { color:#008ebc; } /* DOES APPLY */

    /* FACEBOOK SHARE ADDON */
    .SL .post .post-det li.post-face {
        /* THIS DOESN'T APPLY */
        background: url(images/post-tweet-icon.png) no-repeat left 2px !important;
    }
    .SL .post .post-det .post-face a { color:#A1A1A0; } /* THIS DOES APPLY */
    /* END FACEBOOK SHARE ADDON */

    .SL .post .post-det li.post-edit {
        /* THIS DOESN'T APPLY */
        background: url(images/post-edit-icon.png) no-repeat left 2px !important;
    }
    .SL .post .post-det .post-edit a { color:#ff0000; } /* THIS DOES APPLY */

Answer 2

在您的 CSS 文件中，这些行之后是否有任何将背景设置为无的内容？如果您有 Firebug 或 Chrome，您可以看到该元素应用了哪种样式。