为什么最后一个孩子不工作？

Question

如你所知,我遇到了一个让你解决的问题.
我扯掉了所有的头发,想弄清楚为什么哎last-child不起作用.
我试图删除border-right有last-child,但由于某种原因,没有工作了.
这是链接

Answer 1

你的选择器是#countdown .num:last-child.

你的HTML是

<ul ID="countdown">
  <li> <div ID="days" class="num">00</div>  <div CLASS="text">days</div>     </li>
  <li> <div ID="hours" class="num">00</div> <div CLASS="text">hours</div>    </li> 
  <li> <div ID="mins" class="num">00</div>  <div CLASS="text">minutes</div>  </li>
  <li> <div ID="secs" class="num">00</div>  <div CLASS="text">seconds</div>  </li>
  <div class="clear"></div>
</ul>

想想:是.num其父母的最后一个孩子？答:没有.

你的选择应该是更喜欢#countdown > li:last-of-type .num,选择.num的最后一个内部li在#countdown.

请注意,在这种情况下last-of-type必须使用而不是last-child因为你已经得到了<div class="clear"></div>,这是无效的HTML(你不能div直接在里面ul).