一 .上下文选择符。基于祖先或同胞元素选择一个元素。 上下文不仅仅是父子或者爷孙的关系 无论从该标签到作为祖先的上下文之间隔着多少层次都没有关系。
二 .ID和类选择符。基于id和class属性的值(你自己设定)选择元素。
三 .属性选择符。基于属性的有无和特征选择元素。
一.
特殊的上下文选择符
1.子选择符 >
标签1 > 标签2
标签2必须是标签1的子元素,或者反过来说,标签1必须是标签2的父元素。与常规的上下文选择符不同,这个选择符中的标签1不能是标签2的父元素之外的其他祖先元素。
2.紧邻同胞选择符+
标签1 + 标签2
标签2必须紧跟在其同胞标签1的后面。
3.一般同胞选择符~
标签1 ~ 标签2
标签2必须跟(不一定紧跟)在其同胞标签1后面。
- 通用选择符 *
通用选择符*(常被称为星号选择符)是一个通配符,它匹配任何元素,因此下面这条规则
- {color:green} 会导致所有元素(的文本和边框)都变成绿色。
二 .
ID的用途是在页面标记中唯一地标识一个特定的元素。它能够为我们编写CSS规则提供必要
的上下文,排除无关的标记,而只选择该上下文中的标签。
相对来说,类是可以应用给任意多个页面中的任意多个HTML元素的公共标识符,以便我们
为这些元素应用相同的CSS样式。而且,使用类也让为不同标签名的元素应用相同的样式成
为可能。
三.
(1)属性名选择器
标签名[属性名] 选择任何带有属性名的标签名。 img[title] {border:2px solid blue;}
(2) 属性值选择器
标签名[属性名="属性值“ 选择任何带有值为属性值的属性名的标签名。
img[title="red flower"] {border:4px solid green;}
下面的会被加上css
<img src="images/red_flower.jpg" title="red flower" alt="red flower" />