一、CSS元素选择器
1、CSS元素选择器
最常见的CSS选择器是元素选择器。
2、类型选择器
元素选择器又称类型选择器
3、可以为XML文档中的元素设置样式
<xml-stylesheet type="text/css" href="note.css"?>
二、CSS分组
1、选择器分组
将多个选择器左右放置,元素之间用","分隔。
2、通配符选择器
*
3、声明分组
将多个声明用";"分隔。
4、结合选择器和声明的分组
实际应用中常用到。
三、CSS类型选择器
1、CSS类型选择器
修改HTML代码
class="cls"
语法
"*.cls”,".cls”
2、结合元素类型选择器
语法
"元素.cls"
3、CSS多类选择器
修改HTML代码
class="cls cls"
语法
".cls.cls”
注意:HTML代码的类数量少于语法的类数量。
四、CSS ID 选择器
1、CSS ID 选择器
修改HTML代码
id="id"
语法
"*.id”,".id”
2、与元素结合的ID选择器
"元素.id"
3、类选择器与ID选择器的异同
异
竖向:只能在文档中使用一次;
横向:不能使用ID词列表;
ID能包含更多含义,不局限于元素。
同
区分大小写
五、CSS属性选择器
1、简单属性选择器
A、CSS属性选择器
HTML代码
属性=""
语法
"*[属性]","[属性]"
B、与元素结合
元素[属性]
C、属性列表
[属性][属性]
D、应用于XML中
2、根据具体属性值选择
[属性="属性值"]
元素[属性="属性值"]
[属性="属性值"][属性="属性值"]
应用于XML中
3、根据部分属性值选择
元素[属性~="属性值"]
部分属性值选择器比点号类名记法范围更广,可以应用到任何元素。
4、子串匹配属性选择器
[属性^="属性值"] 以"属性值"开头
[属性$="属性值"] 以"属性值"结尾
[属性*="属性值"] 包含"属性值"
[属性|="属性值"] "属性值"或者以"属性值"开头
六、CSS后代选择器
CSS后代选择器
xx 元素
注意:两个元素之间的层次间隔可以是无限的。
七、CSS子元素选择器
语法
XX>元素
八、CSS相邻兄弟选择器
语法
XX + 元素