CSS选择符归类
一、css样式表的权重关系:
1)内联样式表的优先级别最高;
2)内部样式表与外部样式表的优先级和书写的顺序有关,后书写的优先级别高;
3)同在一个样式表中的优先级和书写的顺序也有关,后书写的优先级别高。(被覆盖的只是相同属性的样式)。
二、选择符:
1)类型选择符(标签选择符)
①所有的html标签可以直接当作选择符进行应用。
②特点:能选中当前结构里面全部同名标签。
③应用:想统一某一个标签样式的时候或者是清除某个标签默认样式的时候。
2)id选择符:
①语法:
·格式:<标签 id="名称"></标签>
·用法:#名称{ 属性:属性值 }
②特点:唯一性!在同一个页面里面,一个id名只能用一次。
③应用:来划分网页外围结构
3)类选择符(class选择符):
①语法:
·格式:<标签 class="名称1 名称2 名称3 名称4..."></标签>
·用法 :.名称{属性:属性值;}
②特点:
a:一个元素可以有多个类名,类名可以重复出现
b:可以制定一类样式.
4)群组选择符:
①语法:以逗号分隔的方式,把多个选择器组成一组,给整组添加样式.
·选择符1,选择符2,选择符3,选择符4{ 属性:属性值; }
·eg : #box,.con,h3,#wrap{ width:300px; }
5)包含选择符(子代选择器\后代选择符)( 通过父元素找子元素 ):
① 语法:
父元素 子元素{ 属性:属性值; }
6) 伪类选择器:
① a:link {color: red;} /* 未访问的链接状态 */
②a:visited {color: green;} /* 已访问的链接状态 */
③a:hover {color: blue;} /* 鼠标滑过链接状态 */
④a:active {color: yellow;} /* 鼠标按下去时的状态 */
补:hover可以适用于所有标签
7)通配符:
①*{ }
②* 选择页面中所有的元素!
③eg:*{
margin:0; 盒子外围间距清零
padding:0; 盒子内部的距离清零
}