E:nth-last-child(n)

语法:

E:nth-last-child(n) { sRules }

说明:

匹配父元素的倒数第n个子元素E,假设该子元素不是E,则选择符无效。大理石平台维修

  • 要使该属性生效,E元素必须是某个元素的子元素,E的父元素最高是body,即E可以是body的子元素
  • 该选择符允许使用一个乘法因子(n)来作为换算方式,比如我们想选中倒数第一个子元素E,那么选择符可以写成:E:nth-last-child(1)
  • 有一点需要注意的是:

    HTML示例代码:

    <div><p>第1个p</p><p>第2个p</p><span>第1个span</span><p>第3个p</p><span>第2个span</span></div>

    如上HTML,假设要命中倒数第一个p(即正数第3个p),那么CSS选择符应该是:

    p:nth-last-child(2){color:#f00;}

    而不是:

    p:nth-last-child(1){color:#f00;}

    因为倒数第1个p,其实是倒数第2个子元素。基于选择符从右到左解析,首先要找到第1个子元素,然后再去检查该子元素是否为p,如果不是p,则n递增,继续查找

    假设不确定倒数第1个子元素是否为E,但是又想命中倒数第1个E,应该这样写:

    p:last-of-type{color:#f00;}

    或者这样写:

    p:nth-last-of-type(1){color:#f00;}

    参考 E:last-of-type 和 E:nth-last-of-type(n)

E:nth-last-child(n)的更多相关文章

  1. 【ToolKit】轻量级JS库

    优点: 丢弃了一些不常用的方法(jQuery.fn):slideUp.fadeIn.animate等: 新增获取子节点的方法(ToolKit.fn):firstChild,lastChild等: 新增 ...

  2. jQuery 2.0.3 源码分析Sizzle引擎 - 词法解析

    声明:本文为原创文章,如需转载,请注明来源并保留原文链接Aaron,谢谢! 浏览器从下载文档到显示页面的过程是个复杂的过程,这里包含了重绘和重排.各家浏览器引擎的工作原理略有差别,但也有一定规则. 简 ...

  3. Python之路【第十八章】:Django基础

    Django基本配置 Python的WEB框架有Django.Tornado.Flask 等多种,Django相较与其他WEB框架其优势为:大而全,框架本身集成了ORM.模型绑定.模板引擎.缓存.Se ...

  4. 网页播放器(jsp、js)

    jsp对控件显示 <%@ page language="java" import="java.util.*" pageEncoding="UTF ...

  5. sizzle源码分析 (4)sizzle 技术总结及值得我们学习的地方

    分析sizzle源码并不是为了去钻牛角尖,而是去了解它的思想,学习下期中一些技术的运用. 1,sizzle中的正则表达式jquery源码中充斥着各种正则表达式,能否看懂其源码的关键之一就是对正则表达式 ...

  6. sizzle源码分析 (1)sizzle架构

    sizzle是jquery的核心,它用来选择匹配的元素,其代码包含在一个匿名函数中,并以window作为其上下文环境: (function( window, undefined ) { //此处为si ...

  7. 双日历插件--jq datepicker时间范围选择

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  8. jquery 计算输入的文本的utf-8字节长度

    jquery-2.1.1.min.js /*! jQuery v2.1.1 | (c) 2005, 2014 jQuery Foundation, Inc. | jquery.org/license ...

  9. 5JS树形结构菜单和jQuery版

    第一版JS版HTML: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...

  10. javascript脚本化文档

    1.getElememtById /** * 获取指定id的的元素数组 */ function getElements(/*ids...*/) { var elements = {}; for(var ...

随机推荐

  1. Java基础笔试练习(二)

    1. HashMap的数据结构是怎样的? A.数组 B.链表 C.数组+链表 D.二叉树 答案: C 解析: JDK8以后,HashMap的数据结构是数组+链表+红黑树 2. 在 JAVA 编程中,J ...

  2. 剑指offer55:链表中环的入口结点

    1 题目描述 给一个链表,若其中包含环,请找出该链表的环的入口结点,否则,输出null. 2 思路和方法 这是一个典型的链表中查找环的问题,基本思路是,首先设置两个快慢指针slow和fast,并且快指 ...

  3. 在做爬虫或者自动化测试时新打开一个新标签页,必须使用windows切换

    在做爬虫或者自动化测试时,有时会打开一个新的标签页或者新的窗口,直接使用xpath定位元素会发现找不到元素,在firefox中定位了元素还是找不到, 经过多次发现,在眼睛视野内看到这个窗口是在最前面, ...

  4. Python【常用的数据类型】

    int,  float,  string整数,浮点数,字符串----------------------------------------字符串(string)用引号括起来的文本 >>& ...

  5. WUSTOJ 1305: 最短路(Java)

    题目链接:

  6. 【HC89S003F4开发板】 4端口消抖

    HC89S003F4开发板端口消抖 一.前言 看到资料里有中断消抖的例子,因为以前项目里有遇到高频干扰频繁退出休眠的情况,所以好奇用这个配置能不能解决. 二.对demo进行修改 @实现效果 P01设置 ...

  7. 整合MyBatis

    配置数据源相关属性(见前一章节 DataSource配置) 引入依赖 <dependency> <groupId>org.mybatis.spring.boot</gro ...

  8. ABP 基于DDD的.NET开发框架 学习(四)时间控件采用datetimepicker注意事项

    $('#datetimepicker1').datetimepicker({ format: 'yyyy/mm/dd hh:ii:ss',//这是只能用小写的大写的与ABP中的字母识别起冲突 loca ...

  9. 转 使用IParameterInspector, IOperationBehavior,Attribute(参数检查器、操作行为接口和标签)扩展WCF操作行为

    public class EntryIdInspector : IParameterInspector { public int intParamIndex { get; set; } string ...

  10. 【转载】Session对象的作用以及常见属性

    Session对象是Asp.Net应用程序中非常重要的一个内置对象,Session是指用户从打开浏览器访问服务器到关闭浏览器之间的会话状态,在一个会话期间,服务器会自动分配一个标识SessionId. ...