div 内的 Last-Child 不工作

Question

我使用 addthis 共享插件并将背景颜色更改为黄色并添加了 bottom-border: of 1px，我想从最后一个 a 中删除底部边框，这对我来说不起作用，使用以下 css

css

div#at4-share a:last-child
{
  border-bottom: 0px solid #1f1f1f; 
}

HTML

<div id="at4-share" class="addthis_32x32_style atss atss-left addthis-animated slideInLeft at4-show">
  <a class="at4-share-btn at-svc-facebook" href="#">
    <span class=" at4-icon aticon-facebook" title="Facebook">Facebook</span>
  </a>
  <a class="at4-share-btn at-svc-twitter" href="#">
    <span class=" at4-icon aticon-twitter" title="Twitter">Twitter</span>
  </a>
  <a class="at4-share-btn at-svc-pinterest_share" href="#">
    <span class=" at4-icon aticon-pinterest_share" title="Pinterest">Pinterest</span>
  </a>
  <a class="at4-share-btn at-svc-google_plusone_share" href="#">
    <span class=" at4-icon aticon-google_plusone_share" title="Google+">Google+</span>
  </a>
  <a class="at4-share-btn at-svc-compact" href="#">
    <span class=" at4-icon aticon-compact" title="More">More</span>
  </a>
  <div id="at4-scc" class="at-share-close-control ats-transparent at4-show at4-hide-content" title="Hide">
    <div class="at4-arrow at-left">Hide</div>
  </div>
</div>

我试过了

div#at4-share a:last-of-type
{
  border-bottom: 0px solid #1f1f1f; 
}

所以我不确定哪里出了问题

Answer 1

正确的选择器是 :last-of-type。

div#at4-share > a:last-of-type
{
  border-bottom:none; /* To remove the bottom border. */
}

FIDDLE

Answer 2

您需要使用 :last-of-type，因为 :last-child 是 div，在这种情况下隐藏文本。

div#at4-share a:last-of-type {border-bottom: 2px solid red;}

https://jsfiddle.net/4y9j0z9q/

也看到了:last-child

https://jsfiddle.net/4y9j0z9q/1/

div 内的 Last-Child 不工作

Last-Child inside div not working

html

css

addthis