css选择器分类
2016-03-24 09:05
337 查看
css选择器大致可以分为10大类:
1、元素选择器 如:p{}
2、类选择器 如:.xx{}
3、ID选择器 如:#xx{}
4、关联选择器 如:p a{}
5、子元素选择器 如:p>a{}
6、相邻兄弟选择器 如:p+a{},匹配的是紧邻p元素后面的a元素
7、组合选择器 如:p,a{}
8、元素选择器 如:img[alt],匹配包含alt属性的img元素
9、伪类选择器 如:a:hover{}
![](http://segmentfault.com/img/bVcccn)
10、伪元素选择器
![](http://segmentfault.com/img/bVccco)
伪元素和伪类之所以这么容易混淆,是因为他们的效果类似而且写法相仿,但实际上
但因为兼容性的问题,所以现在大部分还是统一的单冒号,但是抛开兼容性的问题,我们在书写时应该尽可能养成好习惯,区分两者。
1、元素选择器 如:p{}
2、类选择器 如:.xx{}
3、ID选择器 如:#xx{}
4、关联选择器 如:p a{}
5、子元素选择器 如:p>a{}
6、相邻兄弟选择器 如:p+a{},匹配的是紧邻p元素后面的a元素
7、组合选择器 如:p,a{}
8、元素选择器 如:img[alt],匹配包含alt属性的img元素
9、伪类选择器 如:a:hover{}
10、伪元素选择器
伪元素和伪类之所以这么容易混淆,是因为他们的效果类似而且写法相仿,但实际上
css3为了区分两者,已经明确规定了伪类用一个冒号来表示,而伪元素则用两个冒号来表示。
:Pseudo-classes ::Pseudo-elements
但因为兼容性的问题,所以现在大部分还是统一的单冒号,但是抛开兼容性的问题,我们在书写时应该尽可能养成好习惯,区分两者。
相关文章推荐
- CVE-2010-3971 CSS内存破坏漏洞分析
- +++用纯css改变下拉列表select框的默认样式+++
- CSS3 中关于 select 下拉列表的样式
- js+css实现select的美化效果
- CSS 5种很炫的Hover效果。跳,放大,旋转,淡入,悬浮
- css遇到的垂直水平居中(个人学习笔记)
- 12 个 CSS 高级技巧汇总
- CSS自定义弹出框
- CSS3 transform-origin 属性
- 使用 CSS 预处理器的优缺点有哪些?(SASS,Compass,Stylus,LESS) 描述下你曾经使用过的 CSS 预处理的优缺点。
- 3.CSS基本样式:背景、文本、字体、链接、列表、表格、轮廓
- css让footer始终位于页面的最底部
- ExtJs之Ext.util.CSS
- CSS浮动
- 3月23日学习所得
- Sass学习笔记
- 【CSS3未完】选择器--慕课网【学习总结】
- 3月23.CSS表格布局
- 【CSS】前端笔试题总结
- 第一章:CSS简介和基本语法