伪类选择器

CSS伪类和伪元素总结

大家好!在早期的网页设计之中,我不得不从试验以及错误之中进行学习总结。那时没有可参考的杂志,也没有像 Codepen 或者其它类似的使用工具。如果有人可以为我指点一下,尤其是CSS方面,都将会是很大的帮助。现在我的经验越来越多,我想和大家分享一个有关于CSS 伪类以及伪元素的总结。如果你是一位前端设计者或开发者,你一定对将要讨论的伪元素以及伪类有所了解并且可能使用过它们。然而我还是建议你看看本文所讲的所有条目选项,你可能会有新的收获。

CSS3 选择器——伪类选择器

前面花了两节内容分别在《CSS3选择器——基本选择器》和《CSS3选择器——属性选择器》介绍了CSS3选择器中的基本选择器和属性选择器使用方法,今天要和大家一起学习CSS3选择器中的第三部分,也是最后一部分——伪类选择器。伪类选择器对于大家来说最熟悉的莫过于:link,:focus,:hover之类的了,因为这些在平时中是常用到的伪类选择器,那么先和大家一起简单总结一下CSS中常用的伪类选择器的使用方法,最后把重心放到CSS3新增加的":nth-child"选择器的使用方法。

和前面一样,在开始之前先创建一个Dom:

返回顶部