css选择器

css选择器

---------------------------------20190108更新：期待后续新的技能---------------

兄弟选择器：

#id + div{
	//id为id的的标签的兄弟div标签
	//相邻的第一个兄弟标签
}

#id ~ p{
//所有id="id"之后的同级p元素执行该样式
//不包含子级
}

子类选择器：

#id .class{
	//子类与父类之间有空格
	//#id下所有class中含有class样式的标签
}

#id td:nth-child(1){
	//#id第一个元素的所有td
}

#id div:nth-of-child(1){
	//只有当id="id"的标签下的第一个标签是div才会执行
	//如果第二才是div标签，该样式不会执行
}

//nth-child可多次叠加
#id tr:nth-child(2) td:nth-child(3){
}

//直接子类标签选择器
#id > a{
	//所有直接子类a标签都使用该样式
	//注意：不包含孙子类。即子类的子类
}

属性选择器

a:[href] {
//当a标签中含有href属性时才会应用该样式
}