伪类:

1、结构伪类

A:E : first-child{}

E : nth-*(n){}

E : first-*(even){}

   E : first-*(odd){}

B:nth-child 是根据其父元素中国子元素的总数进行计算

nth-of-type 是根据特定类型的子元素进行计数

nth-last-child 与nth-child类似,不过是从最后开始计算

nth-last-of-type 与nth-of-type 类似,不过是从最后开始计算

C:first-of-type 、last-child、last-of-type区别于nth-child与nth-of-type类似,是相对于特定元素或相对于父元素的第一个元素或最后一个元素

D:only-child :有一个父元素,但没有任何的兄弟元素

only-of-type : 没有相同类型的兄弟元素

2、target伪类

在涉及的URI呗使用的时候,将样式应用到元素中

3、empty伪类

选择没有子元素(包含文本节点)的元素

4、root伪类

选择文档树中的第一个元素,在HTML中,root永远是html元素,使用root可以将html元素赋予更高的特殊度

5、not伪类

E:not(F){}  选择除了作为参数值给出的元素之外的所有元素

传入not伪类的参数都必须是一个简单选择器

伪元素:

1、CSS2中:

:first-line

:first-letter

:after

:before

2、CSS3中,没有添加新的伪元素,但对伪元素的定义稍微进行了优化

::first-line

::first-letter

::after

::before

3、::selection 选择器匹配被用户选取的选取部分

 p::selection {
color:white;
}

Opera以及Webkit已经实现了,Firefox通过前缀实现

以上伪类以及伪元素要考虑IE8

css3 -- 伪类与伪元素的更多相关文章

  1. CSS3伪类和伪元素的特性和区别

    前端er们大都或多或少地接触过CSS伪类和伪元素,比如最常见的:focus,:hover以及<a>标签的:link.visited等,伪元素较常见的比如:before.:after等. 其 ...

  2. CSS3伪类和伪元素

    作为一个CSS3初学不久者来说,很容易混淆单冒号(:)和双冒号(::)的用法,以为两者可以互换着来使用.我自己之前也混淆过他们,因为两者看起来太相像了,就像孪生兄弟.但实际上,他们的区别还是挺大的,最 ...

  3. css3怎么分清伪类和伪元素

    伪类用于向某些选择器添加特殊的效果. 伪元素用于将特殊的效果添加到某些选择器. 伪类有::first-child ,:link:,vistited,:hover,:active,:focus,:lan ...

  4. CSS3伪类和伪元素的特性和区别尤其是 ::after和::before

    伪类和伪元素的理解 官方解释: 伪类一开始单单只是用来表示一些元素的动态状态,典型的就是链接的各个状态(LVHA).随后CSS2标准扩展了其概念范围,使其成为了所有逻辑上存在但在文档树中却无须标识的“ ...

  5. ::before ::after CSS3中的伪类和伪元素

    ::before和::after伪元素的用法 一.介绍 css3为了区分伪类和伪元素,伪元素采用双冒号写法. 常见伪类——:hover,:link,:active,:target,:not(),:fo ...

  6. 妙味css3课程---1-2、css3中新增的伪类和伪元素有哪些

    妙味css3课程---1-2.css3中新增的伪类和伪元素有哪些 一.总结 一句话总结: 1.div:target{}是什么意思? 比如a标签的锚点链接到div,div:target{}就可以找到这个 ...

  7. CSS3伪类与伪元素的区别及注意事项

    CSS中伪类与伪元素的概念是很容易混淆的 今天就来谈谈伪类与伪元素之间的区别 定义 首先先来看看伪类与伪元素的定义 w3c中对于它们是这么解释的 伪类:用于向某些选择器添加特殊的效果 伪元素:用于将特 ...

  8. css3的伪(伪类和伪元素)大合集

    本文讲css3的伪,不是讲它有多虚伪,而是说它的伪元素样式.不得不说以前虽知html伪元素,但很少用,后得知借助css3伪元素可以发挥极大的便利.故总结css3的伪如下: CSS中存在一些比较特殊的属 ...

  9. CSS3 动态生成内容(在Web中插入内容)====CSS的伪类或者伪元素

    # css3 .类:伪类::伪元素 /* CSS3伪元素/伪类 :https://www.w3.org/TR/css3-selectors/#selectors ::selection 伪元素(F12 ...

随机推荐

  1. 6. ZigZag Conversion

    题目: The string "PAYPALISHIRING" is written in a zigzag pattern on a given number of rows l ...

  2. osg 纹理访问器

    #include<osgViewer/Viewer> #include<osg/Node>#include<osg/Geode>#include<osg/Gr ...

  3. Linux iostat字段解析

    iostat主要用于监控系统设备的IO负载情况,iostat首次运行时显示自系统启动开始的各项统计信息,之后运行iostat将显示自上次运行该命令以后的统计信息.用户可以通过指定统计的次数和时间来获得 ...

  4. “无法更新EntitySet“*****”,因为它有一个DefiningQuery,而元素中没有支持当前操作的元素”问题的解决方法

    百思不得其解,最后发现 1:实体中的表必须有主键(数据库中的表必须有主键),如果没有,会有这样的提示 2:主键设置好后,运行还是会出现类似问题,那就一个郁闷 1):方法一:先从EF中删除刚设置主键的模 ...

  5. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(六) 之 Layim源码改造右键菜单--好友、组管理功能的实现。

    前言 上一篇中讲解了加好友的流程,本篇将介绍好友管理,群组管理的右键菜单功能.当然由于菜单项目太多,都实现也得花费时间.只讲解一下我是如何从不知道怎么实现右键菜单到会自定义菜单的一个过程.另外呢,针对 ...

  6. 一个简单的jsp+servlet实例,实现简单的登录

    开发环境myeclipse+tomcat6 1.先创建web project,项目名为RegisterSystem, 2.在WebRoot 目录下创建login.jsp文件,只需修改body中的内容, ...

  7. js获取缓存数据

    后台:request.setAttribute("type", type); 前台js获取:var type = "${type}";

  8. JQuery阻止冒泡事件on绑定中异常情况分析

    科普下事件冒泡以及默认行为,以下面例子举列子:     事件冒泡:当点击内部button元素时,会触发自身及外层 a的点击事件,这就是事件冒泡引起的.事件会随着 DOM 的层次结构依次向上传播. 事件 ...

  9. Sphinx的介绍和原理探索

    What/Sphinx是什么 定义 Sphinx是一个全文检索引擎. 特性 索引和性能优异 易于集成SQL和XML数据源,并可使用SphinxAPI.SphinxQL或者SphinxSE搜索接口 易于 ...

  10. 在ubuntu上搭建开发环境4---ubuntu简单的搭建LAMP环境和配置

    最近重新安装了Ubuntu,但是之前的LAMP环境自然也就没有了,实在是不想再去编译搭建LAMP环境(这种方法实在是太费时间,而且太容易遇到各种不知道为什么的错误),所以,就去查查有没有什么简单的搭建 ...