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. 外网访问虚拟机搭建的web服务

    凌晨了,就简单写个一定可行的思路吧,有时间了再补上. 设置虚拟机为桥接模式,当然NAT也行,只是我嫌NAT麻烦 设置路由器,将虚拟机端口映射到外网

  2. xsy 2412【BZOJ4569】【Scoi2016】萌萌哒

    Description Description 一个长度为n的大数,用S1S2S3...Sn表示,其中Si表示数的第i位,S1是数的最高位,告诉你一些限制条件,每个条件表示为四个数,l1,r1,l2, ...

  3. 编程语言、Python介绍及其解释器安装、运行Python解释器的两种方式、变量、内存管理

    一.编程语言介绍 1.1 机器语言:直接用计算机能理解的二进制指令来编写程序,直接控制硬件. 1.2 汇编语言:在机器语言的基础上,用英文标签取代二进制指令来编写程序,本质上也是直接控制硬件. 以上2 ...

  4. 机器学习之softmax回归笔记

    本次笔记绝大部分转自https://www.cnblogs.com/Luv-GEM/p/10674719.html softmax回归 Logistic回归是用来解决二类分类问题的,如果要解决的问题是 ...

  5. Hibernate持久化,生命周期

    一 .生命周期   1.1  . 说明 持久化类就是我们所说的实体类,实体类(持久化类)对象是有状态的. 为什么实体类对象会有状态? 答:由于HIbernate框架是一个先映射,后操作的框架.所谓的状 ...

  6. centos可选的安装类型

    Desktop :基本的桌面系统,包括常用的桌面软件,如文档查看工具. Minimal Desktop :基本的桌面系统,包含的软件更少. Minimal :基本的系统,不含有任何可选的软件包. Ba ...

  7. VS.NET(C#)--1.3_VS2005开始

    VS2005开始 开始页 1.文件系统:这是默认,把网站创建到当前物理文件系统上(可以本地或网络).此时VS2005将使用内置的Web服务器,不使用IIS运行Web应用程序.2.HTTP使用IIS处理 ...

  8. Flask无法访问(127.0.0.1:5000)的问题解决方法

    Flask默认开启的ip地址是:http://127.0.0.1:5000/ 但在运行时可能存在无法访问的问题,特别是当我们在linux服务器上搭建flask时,此时需要将代码修改如下: app.ru ...

  9. C# 泛型集合排序

    Student sModel = new Student(); List<Student > list = new List<Student >(); list= list.O ...

  10. 效率提升工具Listary

    效率提升工具Listary https://baijiahao.baidu.com/s?id=1590032175308204846&wfr=spider&for=pc