关于两者的区别，其实是很古老的问题。但是时至今日，由于各种网络误传以及一些不负责任的书籍误笔，仍然有相当多的人将伪类与伪元素混为一谈，甚至不乏很多CSS老手。早些年刚入行的时候，我自己也被深深误导，因为论坛里的帖子大多不关心这种概念的细微差别，即使有人出来说一句：“这两个是不同的”，也只是被更多的帖子淹没掉而已。所以觉得有必要写下这些我所知的部分，这里着重写的是为什么这两者不同，以及一些平时容易错过的细节。

无论是伪类还是伪元素，都属于CSS选择器的范畴。所以它们的定义可以在CSS标准的选择器章节找到。分别是 CSS2.1 Selectors 和 CSS Selector Level 3，两者都已经是推荐标准。

相同点：

Pseudo-class和pseudo-element的语法都是以selector或者selector.class开始的。

不同点：

Pseudo-class的操作对象是文档树中已有的元素，而pseudo-element则创建了一个文档数外的元素。因此，Pseudo-class和pseudo-element的区别在于：有没有创建一个文档树之外的元素。Pseudo-class只有一个冒号，pseudo-element有两个冒号

引用自网页：http://www.mamicode.com/info-detail-2496434.html

pseudo-class与pseudo-element的不同点与相同点的更多相关文章

  1. sessionStorage和localStorage的用法，不同点和相同点

    一,共同点 (1)存储时用setItem: localStorage.setItem("key","value");//以"key"为名称存 ...

  2. css中attribute selector及pseudo class

    https://developer.mozilla.org/en-US/docs/Web/CSS/Reference#Selectors 在css3规范中,定义了以下几种类型的selector: Ba ...

  3. 解密jQuery内核 Sizzle引擎筛选器 - 位置伪类（一）

    本章开始分析过滤器,根据API的顺序来 主要涉及的知识点 jQuery的组成 pushStack方法的作用 sizzle伪类选择器 首页我们知道jQuery对象是一个数组对象 内部结构 jQuery的 ...

  4. (转)　Written Memories: Understanding, Deriving and Extending the LSTM

    R2RT   Written Memories: Understanding, Deriving and Extending the LSTM Tue 26 July 2016 When I was ...

  5. org.jsoup.select.Selector

    org.jsoup.select.Selector CSS-like element selector, that finds elements matching a query. Selector ...

  6. Sizzle 源码分析 （二）

    在Sizzle函数中,如果能快速处理或者通过querySelector处理,那么就使用它处理.否则使用select函数处理 . select函数 select = Sizzle.select = fu ...

  7. jquery-1.11.1.js

       每次想要使用这个js时,总是要到官网上下载,太麻烦,现在把它收录了 jquery-1.11.1.js /*! * jQuery JavaScript Library v1.11.1 * http ...

  8. puppeteer(五）chrome启动参数列表API

    List of Chromium Command Line Switches https://peter.sh/experiments/chromium-command-line-switches/ ...

  9. CEF 支持的命令行参数

    参考:https://peter.sh/experiments/chromium-command-line-switches/ List of Chromium Command Line Switch ...

随机推荐

  1. java笔记 -- 输入输出

    读取输入: 如果想通过控制台进行输入, 首先需要构造一个Scanner对象.并与'标准输入流'System.in关联. 代码见下文代码块. Sanner (InputStream in) 用给定的输入 ...

  2. [Database]Oracle数据库中concat和||的区别

    注:在oracle中,需要上述多次拼接应使用||,因为concat()一次只能拼接2个,需要多次嵌套.而在mysql中,可以实现concat(col1,col2,coln....) 官方文档链接:CO ...

  3. linux shell 脚本 svn自动更新项目并且打包 、发布、备份

    这里先准备一个配置文件,用于保存svn地址.目的路径.用户名跟密码 配置文件名问:toolConfig.properties #svn地址 svnAddress=https://192.168.1.2 ...

  4. RESTful Level

    REST(表述性状态转移)是最近几年讨论的最为热烈的话题之一,其起源于Roy.T.Fielding博士的论文<软件架构风格和基于网路的软件架构设计>.Roy博士在他的论文里从架构风格角度阐 ...

  5. [GXOI/GZOI2019]旧词

    很像LNOI 2014 LCA那道题. 同样的套路,离线以后直接扫描线. k=1的话就是原题. 考虑一般情况. 原本的做法是对x到根的这条链做一下区间+1操作,目的是为了是的在深度为i的位置得到的贡献 ...

  6. 如何使用git拉取代码及提交代码(详细)

    分享给刚进入公司的小伙伴们鸭! 第一步:首先在本地安装git和TorToiseGit小乌龟,svn同理,也可以安装下TorToiseGit中文语言包,前期可减少出错,后期熟悉了可直接用命令行pull代 ...

  7. 织梦默认编辑器换成kindEditor实操教程

    织梦默认编辑是CKeditor,要想换成kindEditor编辑器,按如下步骤操作. 先看效果图: 首先下载打包好的 kindEditor_for_dedeCMS.ZIP,下载地址:https://d ...

  8. 德邦总管 修改oracle数据库用户密码的方法

    WIN+R打开运行窗口,输入cmd进入命令行: 输入sqlplus ,输入用户名,输入口令(如果是超级管理员SYS的话需在口令之后加上as sysdba)进入sql命令行:    连接成功后,输入“s ...

  9. vue-cli（vue脚手架） 简单使用

    1.vue-cli 作用 vue-cli作为vue的脚手架,可以帮助我们在实际开发中自动生成vue.js的模板工程. 2.vue-cli 使用 a. 安装全局vue-cli npm install v ...

  10. 在浏览器端获取文件的MD5值

    前几天接到一个奇怪的需求,要在web页面中计算文件的md5值,还好这个项目是只需兼容现代浏览器的,不然要坑死了. 其实对文件进行md5,对于后端来说是及其简单的.比如使用Node.js,只要下面几行代 ...