CSS选择器
基本选择器;
*:全局选择器(全部标签),全部的标签都具有相同的样式标签选择器(element):相同的标签样式具有相同的样式
类别选择器(class):相同的标签可以具有不同的样式,不同的标签可以具有相同的样式
id选择器(id):唯一性,优先级 高
层级选择器:
群组选择器 *,p*.class,#id{},群组在一起的选择器具有相同的样式后代选择器 空格 p span{} .div1 p{} 儿子 孙子 重孙...
子元素选择器 > p>span{} .div>p 只能找到儿子 找不到孙子重孙啥的了
动态伪类选择器:(IE6时,只能给a标签添加,现在可以给任何一个标签添加)
:link 表示链接时的状态:visited 表示访问过的状态
:hover 表示鼠标经过的状态 常用
:active 表示鼠标点击时的状态
:nth伪类选择器
:first-child 第二个子元素:last-child 最后一个子元素
:nth-child 第n个子元素
even:偶数 odd 奇数
示例
table{
background-color:red;
border-color:blue;
width:100%;
height:500px;
text-align:center;
font-size:32px;
}
/*
table td:nth-child(even){
background-color:yellow;
}
table td:nth-child(odd){
background-color:green;
}
*/
table td:nth-child(2n+1){
background-color:blue;
}
table td:nth-child(2n){
background-color:green;
}
table td:first-child{
background-color:red;
}
table td:last-child{
background-color:pink;
}
/*
tr:nth-child(odd){
background-color:yellow;
}
tr:nth-child(even){
background-color:blue;
}
tr:first-child{
background-color:red;
}
tr:last-child{
background-color:pink;
}
*/