码迷,mamicode.com
首页 > Web开发 > 详细

CSS3---结构性伪类选择器—nth-last-child(n)

时间:2015-05-04 22:01:00      阅读:213      评论:0      收藏:0      [点我收藏+]

标签:

结构性伪类选择器—nth-last-child(n)

“:nth-last-child(n)”选择器和前面的“:nth-child(n)”选择器非常的相似,只是这里多了一个“last”,所起的作用和“:nth-child(n)”选择器有所区别,从某父元素的最后一个子元素开始计算,来选择特定的元素。

案例演示

选择列表中倒数第五个列表项,将其背景设置为橙色。

HTML代码:

<ol>
  <li>item1</li>
  <li>item2</li>
  <li>item3</li>
  <li>item4</li>
  <li>item5</li>
  <li>item6</li>
  <li>item7</li>
  <li>item8</li>
  <li>item9</li>
  <li>item10</li>
  <li>item11</li>
  <li>item12</li>
  <li>item13</li>
  <li>item14</li>
  <li>item15</li>
</ol>?

CSS代码:

ol > li:nth-last-child(5){
  background: orange;
}

演示结果:

技术分享

CSS3---结构性伪类选择器—nth-last-child(n)

标签:

原文地址:http://www.cnblogs.com/beast-king/p/4477543.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!