CSS选择器

CSS选择器

1、标签选择器：会对页面上同类型所有的标签设置样式

标签名{
    属性名：属性值
}
例如：
body{
    background-color：black
}
效果：设置页面上所有的body设置背景颜色为黑色

2、id选择器：能够对单独的某个标签设置样式，同一个页面不允许有一样的id属性

• 给需要单独设置样式的标签添加id属性，然后利用css的id选择器设置样式

html：
<td id="diyige"></td>
css:
#id的属性值{
    属性名：属性值
}

3、class选择器：对具有相同class属性设置多个标签同时设置样式

•  给需要设置样式的这些标签设置一样的class属性，class属性每个标签都可以设置，然后利用class选择器来进行设置

.class属性值{
    属性名：属性值
}

4、组合选择器：同时使用id，class，标签选择器中的一种或多种，来达到给多个标签设置样式的                             目的

• 作用：减少不必要的class代码
• 思路：利用标签的嵌套关系开精确寻找需要设置样式的标签

table a{
    color:white;
}
body .item{
    color:red;
}

5、伪类选择器：改变鼠标的行为来改变标签的样式

分类

• a:link：超链接专属，页面一打开超链接就有的样式，旧属性
• a:visited：超链接专属，超链接访问之后的样式
• :hover：鼠标悬停到标签上时标签使用的样式
• :active：鼠标点击标签不释放时使用的样式
• :focus：当标签获取鼠标焦点时使用的样式

基本使用语法

a:link{
    css属性名：属性值
}

a:visited{
    属性名：属性值
}

非伪类选择器:hover{
    css属性名：属性值
}

非伪类选择器:active{
    属性名：属性值
}
非伪类选择器:focus{
    属性名：属性值
}