E:nth-last-child(n)
E:nth-last-child(n)
语法:
E:nth-last-child(n) { sRules }
说明:
- 要使该属性生效,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)的更多相关文章
- 【ToolKit】轻量级JS库
优点: 丢弃了一些不常用的方法(jQuery.fn):slideUp.fadeIn.animate等: 新增获取子节点的方法(ToolKit.fn):firstChild,lastChild等: 新增 ...
- jQuery 2.0.3 源码分析Sizzle引擎 - 词法解析
声明:本文为原创文章,如需转载,请注明来源并保留原文链接Aaron,谢谢! 浏览器从下载文档到显示页面的过程是个复杂的过程,这里包含了重绘和重排.各家浏览器引擎的工作原理略有差别,但也有一定规则. 简 ...
- Python之路【第十八章】:Django基础
Django基本配置 Python的WEB框架有Django.Tornado.Flask 等多种,Django相较与其他WEB框架其优势为:大而全,框架本身集成了ORM.模型绑定.模板引擎.缓存.Se ...
- 网页播放器(jsp、js)
jsp对控件显示 <%@ page language="java" import="java.util.*" pageEncoding="UTF ...
- sizzle源码分析 (4)sizzle 技术总结及值得我们学习的地方
分析sizzle源码并不是为了去钻牛角尖,而是去了解它的思想,学习下期中一些技术的运用. 1,sizzle中的正则表达式jquery源码中充斥着各种正则表达式,能否看懂其源码的关键之一就是对正则表达式 ...
- sizzle源码分析 (1)sizzle架构
sizzle是jquery的核心,它用来选择匹配的元素,其代码包含在一个匿名函数中,并以window作为其上下文环境: (function( window, undefined ) { //此处为si ...
- 双日历插件--jq datepicker时间范围选择
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- jquery 计算输入的文本的utf-8字节长度
jquery-2.1.1.min.js /*! jQuery v2.1.1 | (c) 2005, 2014 jQuery Foundation, Inc. | jquery.org/license ...
- 5JS树形结构菜单和jQuery版
第一版JS版HTML: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...
- javascript脚本化文档
1.getElememtById /** * 获取指定id的的元素数组 */ function getElements(/*ids...*/) { var elements = {}; for(var ...
随机推荐
- Python3之字符串格式化format函数详解(下)
格式限定符 format通过丰富的的“格式限定符”(语法是 {}中带:号)对需要格式的内容完成更加详细的制定. 进制转换 我们可以再限定符中制定不同的字符对数字进行进制转换的格式化,进制对应的表格: ...
- LaTeX 课本、LaTeX 学习方法、LaTeX 入门(2)
1. 关于TeX,LaTeX,MikTex,CTeX等的区别 2. 课本 课本1 >> 下载链接:复制链接到迅雷或IDM下载很快 课本2 >> 下载链接:复制链接到迅雷或IDM ...
- Python34之模块测试(__name__ == "__main__")
def c2f(cel): fah = cel * 1.8 + 32 return fah def f2c(fah): cel = (fah -32) / 1.8 return cel def tes ...
- 用php的for循环输出四边形,各种三角形和菱形【含空心版本】
<?php // 实心版 //四边形 for( $i = 1; $i <=5; $i++ ){ for( $j = 1; $j <=5; $j++ ){ echo '*'; } ec ...
- Java连接Jira,创建、修改、删除工单信息
还不了解Jira是什么的同学可以看一下这篇文章:https://www.cnblogs.com/wgblog-code/p/11750767.html 本篇文章主要介绍如何使用Java操作Jira,包 ...
- 20190705-记IIS发布.NET CORE框架系统之所遇
新手在IIS上发布.NET CORE框架的系统之注意事项 序:本篇随笔是我的处子笔,只想记录自己觉得在系统发布过程中比较重要的步骤,一来,忝作自己的学习笔记,以备不时之需,二来,也希望可以帮助有需要的 ...
- 转 winfrom组件圆角
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- linux Ubuntu14.04 make编译文件报错:No rule to make target `/usr/lib/libpython2.7.so', needed by `python/_pywraps2.so'. Stop.
错误过程:当“make”编译文件时报错No rule to make target `/usr/lib/libpython2.7.so', needed by `python/_pywraps2.so ...
- 《阿里巴巴 Java 开发规约》自动化检测插件安装及体验
2017 开春之际,有助于提高行业编码规范化水平的<阿里巴巴 Java 开发手册>首次面世.汇聚阿里集团近万名技术精英的经验知识,这套高含金量的手册一经公开,便引起业界普遍关注和学习. 历 ...
- 1+x证书学习日志——css常用属性
## css常用属性: 1:文本属性: 文本大小: font-size:18px; 文本颜色 colo ...