CSS3 知识量:11 - 43 - 138
基本选择器是CSS最基础的选择器,在CSS1中就已经定义了。
选择器 | 类型 | 说明 |
---|---|---|
* | 通配选择器 | 选择文档中所有的HTML元素 |
E | 元素选择器 | 选择指定类型的HTML元素 |
#id | ID选择器 | 选择ID属性值为“id”的任意类型元素 |
.class | 类选择器 | 选择class属性值为“class”的任意类型任意多个元素 |
selector1,selectorN | 群组选择器 | 将每个选择器匹配的元素集合合并 |
各浏览器对基本选择器都有很好的支持。
通配选择器(*)用于选择所有元素,也可以选择某个元素的所有子孙元素。
示例:设置所有的元素外边距为0,内边距为0。
*{ margin: 0; padding: 0; }
示例:设置p元素的所有子元素的字体大小为14px。
p>*{ font-size: 14px; }
元素选择器通过DOM元素名称来选择同类元素。
示例:设置所有p元素的字体大小为14px。
p{ font-size: 14px; }
示例:设置所有的链接a元素字体颜色为黑色。
a{ color: #000; }
ID选择器通过元素的id值来选择某个元素。使用前,必须首先设置元素的id值,同一个页面元素的id值应当是唯一的,因此,通过ID选择器一次只能选择一个元素。
通过#和id属性值的方式来选择具体元素。
示例:设置id值为bob的元素的背景色为白色。
#bob{ background-color: #fff; }
类选择器通过元素的类(class)属性值选择相应元素。
示例:设置类属性值为ok的元素字体颜色为黑色。
.ok{ color: #000; }
示例:设置类属性值为ok的链接元素a的字体颜色为黑色。
a.ok{ color: #000; }
如果多个选择器选择的元素具有相同的样式定义,可以将这些选择器集中到一起进行样式定义,从而简化代码,这称之为群组选择器。其中,各选择器之间通过逗号(,)进行分割。
示例:设置a元素、p元素和类属性值为ok的元素的字体大小为14px。
a,p,.ok{ font-size: 14px; }
Copyright © 2017-Now pnotes.cn. All Rights Reserved.
编程学习笔记 保留所有权利
MARK:3.0.0.20240214.P35
From 2017.2.6