你的位置:首页 > 软件开发 > 网页设计 > 【CSS进阶】伪元素的妙用

【CSS进阶】伪元素的妙用

发布时间:2016-05-26 00:00:22
最近在研读 《CSS SECRET》(CSS揭秘)这本大作,对 CSS 有了更深层次的理解,折腾了下面这个项目:CSS3奇思妙想 -- Demo (请用 Chrome 浏览器打开,非常值得一看)。采用单标签完成各种图案,许多图案与本文有关。也希望觉得不错的同学顺手在我的 ...

最近在研读 《CSS SECRET》(CSS揭秘)这本大作,对 CSS 有了更深层次的理解,折腾了下面这个项目:

CSS3奇思妙想 -- Demo (请用 Chrome 浏览器打开,非常值得一看)。采用单标签完成各种图案,许多图案与本文有关。

也希望觉得不错的同学顺手在我的 Github 点个 star : CSS3奇思妙想 。

 

正文从这里开始,本文主要讲述一下 伪元素 before 和 after 各种妙用。

   :before和::before的区别

在介绍具体用法之前,简单介绍下伪类和伪元素。伪类大家听的多了,伪元素可能听到的不是那么频繁,其实 CSS 对这两个是有区分的。

【CSS进阶】伪元素的妙用【CSS进阶】伪元素的妙用

有时你会发现伪类元素使用了两个冒号 (::) 而不是一个冒号 (:),这是 CSS3 规范中的一部分要求,目的是为了区分伪类和伪元素,大多数浏览器都支持这两种表示方式。

#id:after{ ...}#id::after{ ...}
 

原标题:【CSS进阶】伪元素的妙用

关键词:CSS

CSS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。