详解CSS3中的属性选择符(4)
作者:dudo 来源:dudo says 发布时间:2008-04-24 14:30:00
:nth-of-type()
:nth-of-type()伪类和nth-child()伪类找使用方法十分相似,只不过他匹配的是规则中指明类型的元素。下面的规则将会匹配每个属于父元素中第三个子元素的p元素(属于第3个子元素的p在一个该当中可能会有很多,只不过他们位于不同的父元素下,dudo注):
p:nth-of-type(3) { background:#ff0; }
当你想确定是否已经指向了第三个p元素,这种方法会很有用。开始你可能觉得这和使用nth-child效果是一样的,但是nth-child(3)会把所有的子元素都计算进来,因此结果可能就会不一样,除非p所有的所有兄弟元素也都是p元素。
:nth-of-type伪类目前还没有浏览器支持。
:nth-last-of-type伪类
:nth-last-of-type伪类指向的元素在其后还有若干同类型的元素。和:nth-last-child伪类一样,它是从最后一个子元素向回数的。下面的规则将会匹配到倒数第二个兄弟元素p中(注意:是兄弟、同级别的节点):
p:nth-last-of-type(2) { background:#ff0; }
:nth-last-of-type()目前还没有浏览器支持。
:last-child伪类
:last伪类指向的是父元素中最后一个子元素。它和:nth-last-child(1)效果是一样的。下面的规则匹配所有属于父元素中最后一个子元素的p:
p:last-child { background:#ff0; }
:last-childe伪类可以在基于Mozilla的浏览器中使用。Opera不支持:last-childe伪类,在Safri中存在bug(上面的规则会匹配到所有的p元素)。令人稀奇是的它可以在OmniWeb(测试版本5.1.1)中正常使用,尽管这个浏览器是基于Safari的。这可能是因为Apple WebKit最新版本的回归,因为OmniWeb使用的WebKit通常要比Safari版本稍微低一点。
:first-of-type伪类
:first-of-type伪类指向同类型元素中的第一个元素。它和:nth-of-type(1)是一样的。
p:first-of-type { background:#ff0; }
:first-of-type伪类目前还没有浏览器支持。
:last-of-type伪类
:last-of-type伪类指向同类型元素中的最后一个元素。它和nth-last-of-type(1)是一样的。
p:last-of-type { background:#ff0; }
:last-of-type伪类目前还没有浏览器支持。
:only-child伪类
:only-childe伪类指向的是那些父元素中再没有其他任何子元素的元素。它和:first-child:last-child或者:nth-child(1):nth-last-child(1)是一样的(后者不够专业、简明)。
p:only-child { backgound:#ff0; }
:only-childe伪类目前可以在基于Mozilla的浏览器中使用。在Safari似乎被解释成了:first-child(上面的规则会被匹配到文档中所有第一个子元素p中)。
:only-of-type伪类
:only-of-type伪类指向的是那些父元素中再也没有与之类型相同的子元素。这和:first-of-type:last-of-type或者:nth-of-type(1):nth-last-of-type(1)相同(后者专业性不够)。
p:only-of-type { background:#ff0; }
:only-of-type伪类目前还没有浏览器支持。


猜你喜欢
- 1.背景看到这个标题你可能想一个分块能有什么难度?还值得细说吗,最近确实遇到一个有意思的分块函数,写法比较巧妙优雅,所以写一个分享。日前在做
- 线性回归是机器学习中的基础算法之一,属于监督学习中的回归问题,算法的关键在于如何最小化代价函数,通常使用梯度下降或者正规方程(最小二乘法),
- 高性能异步爬虫目的:在爬虫中使用异步实现高性能的数据爬取操作异步爬虫的方式:- 多线程、多进程(不建议):好处:可以为相关阻塞的操作单独开启
- 比较喜欢python的装饰器, 试了下一种用法,通过装饰器来传递sql,并执行返回结果这个应用应该比较少为了方便起见,直接使用了ironpy
- ALTER TABLE将表更改为当前字符集。如果在执行ALTER TABLE操作期间遇到重复键错误,原因在于新的字符集将2个键映射到了相同值
- MySQL插件式存储引擎是MySQL数据库服务器中的组件,负责为数据库执行实际的数据I/O操作,并能允许和强制执行面向特殊应用需求的特定特性
- 1.基本信息? Pandas 的 apply() 方法是用来调用一个函数(Python method),让此函数对数据对象进行批量处理。Pa
- 不同于以往为大家介绍的函数使用,我们利用pivot函数可以实现的方式,就是用来重塑数据使用的,在python的使用上并不常见,但是如果需要利
- Python 语言与 Perl,C 和 Java 等语言有许多相似之处,也有一定的差异性,以下是Python语言获取文件后缀名和文件名的方法
- 前言硬要说这篇文章怎么来的,那得先从那几个吃野味的人开始说起…… 前天睡醒:假期还有几天;昨天睡醒:假期还有十几天;今天睡醒:假期还有一个月
- PDOStatement::fetchColumnPDOStatement::fetchColumn — 从结果集中的下一行返回单独的一列。
- 1.lxml库简介lxml 是 Python 常用的文档解析库,能够高效地解析 HTML/XML 文档,常用于 Python 爬虫。lxml
- 队列是一种只允许在一端进行插入操作,而在另一端进行删除操作的线性表。在Python文档中搜索队列(queue)会发现,Python标准库中包
- 以下几种方法来模拟enum:(感觉方法一简单实用)# way1class Directions: up
- isdecimal()方法检查字符串是否仅由十进制字符组成。此方法只存在于unicode对象。注意:要定义一个字符串为Unico
- 本文实例讲述了python中的lambda表达式用法。分享给大家供大家参考,具体如下:这里来为大家介绍一下lambda函数。lambda 函
- enumerate函数用于遍历序列中的元素以及它们的下标。enumerate函数说明:enumerate()是python的内置函数enum
- 一 前言知识追寻者又要放大招了,学完这篇openpyxl第三方库,读者将会懂得如何灵活的读取excel数据,如何创建excel工作表;更新工
- 本文实例讲述了Python面向对象程序设计之私有属性及私有方法。分享给大家供大家参考,具体如下:如果有一个对象,当需要对其进行修改属性时,有
- 这篇文章主要介绍了python3获取文件中url内容并下载代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价