· CSS选择符(就是选择器)
o 基础选择器
通配符选择器 *{}
标签选择器标签名 p{}
class类选择器 .class属性值{}
多类名选择器 .类名n{} 标签中class属性为 class="类名1 类名2 ... 类名n"
id选择器 #id属性值{}
群组选择器 选择器1,选择器2,...{}
o 结构选择器
子元素选择器E>F{} F必须是E的子元素
后代选择器E F{} F必须是E的后代
相邻兄弟选择器E+F{} F是紧挨这E后面的兄弟元素
通用选择器E~F{} F是E后面所有的兄弟元素
o 属性选择器
[Eattr] 元素E中存在attr属性
[Eattr="value"] 元素E中存在attr属性,并且attr的属性值为value
[Eattr~="value"] 元素E中存在attr属性,并且attr的属性值为value或者"value value1 ..."的形式
[Eattr^="value"] 元素E中存在attr属性,并且attr的属性值以value开始
[Eattr$="value"] 元素E中存在attr属性,并且attr的属性值以value结尾
[Eattr*="value"] 元素E中存在attr属性,并且attr的属性值存在value
[Eattr|="value"] 元素E中存在attr属性,并且attr的属性值为value或者value-的形式
o 结构伪类选择器
X:first-child 匹配子集的第一个元素
X:last-child匹配父元素中最后一个X元素
X:nth-child(n)用于匹配索引值为n的子元素。索引值从1开始
X:only-child这个伪类一般用的比较少，比如上述代码匹配的是div下的有且仅有一个的p，也就是说，如果div内有多个p，将不匹配。
X:root匹配文档的根元素。在HTML(标准通用标记语言下的一个应用)中，根元素永远是HTML
X:empty匹配没有任何子元素(包括包含文本)的元素
o 目标伪类
E:target 选择匹配E的所有元素，且匹配元素被相关URL指向
o UI状态伪类
E:enabled 匹配所有用户界面(form表单)中处于可用状态的E元素
E:disabled 匹配所有用户界面(form表单)中处于不可用状态的E元素
E:checked 匹配所有用户界面(form表单)中处于选中状态的元素E
E:selection 匹配E元素中被用户选中或处于高亮状态的部分
o 否定伪类
E:not(s) (IE6-8浏览器不支持:not()选择器。)匹配所有不匹配简单选择符s的元素E
o 动态伪类
E:link 链接伪类选择器 选择匹配的E元素，而且匹配元素被定义了超链接并未被访问过。常用于链接描点上
E:visited 链接伪类选择器 选择匹配的E元素，而且匹配元素被定义了超链接并已被访问过。常用于链接描点上
E:active 用户行为选择器 选择匹配的E元素，且匹配元素被激活。常用于链接描点和按钮上
E:hover 用户行为选择器 选择匹配的E元素，且用户鼠标停留在元素E上。IE6及以下浏览器仅支持a:hover
E:focus 用户行为选择器 选择匹配的E元素，而且匹配元素获取焦点
· 属性继承
o 继承：html元素可以从父元素那里继承一部分css属性，即使当前元素没有定义该属性。
1.字体系列属性 font，font-family，font-weight，font-size，font-style
2.文本系列属性 text-indent，text-align，line-height，word-spacing，letter-spacing，text-transform，color
3.元素可见性 visibility
4.表格布局属性 caption-side，border-collapse，border-spacing，empty-cells，table-layout
5.列表布局属性 list-style-type，list-style-image，list-style-position，list-style
· 选择器优先级的算法
o 优先级就近原则，同权重情况下样式定义最近者为准;
o 载入样式以最后载入的定位为准;
o 优先级为：同权重: 内联样式表(标签内部)> 嵌入样式表(当前文件中)> 外部样式表(外部文件中)。
o !important > id > class > tag important 比内联优先级高。
更多关于“前端培训”的问题，欢迎咨询千锋教育在线名师。千锋教育多年办学，课程大纲紧跟企业需求，更科学更严谨，每年培养泛IT人才近2万人。不论你是零基础还是想提升，都可以找到适合的班型，千锋教育随时欢迎你来试听。
京公网安备 11010802030320号