伪元素选择器 属性选择器 兄弟元素选择器

伪元素选择器

一、伪元素：
使用伪元素来表示元素中的一些特殊位置
常用：
1、：first-letter 为元素中的第一个位置设置样式
2、：first-line 为元素中的第一行位置设置样式
3、：before 为元素最前边的部分设置样式（一般before都需要结合属性content样式一起使用
通过content可以向before或after位置添加一些内容）

			语法：p:before{
			content："content添加的最前边内容";
		}
4、：after 最后边部分设置样式
			语法：p:after{
			content:"content添加的最后边内容";
			}

二、属性选择器

1、title属性：1、这个属性可以给任何标签指定
当鼠标移入到元素上时元素中title属性的值将会作为提示文字显示

我是一个段落

		2、为所有具有title属性的元素设置样式：

2、常用属性选择器的语法： [属性名] 选取含有指定属性的元素
[属性名=“值”] 选取含有指定属性值的元素
[属性名^=“属性值”] 选取这个值以指定值开头的元素
例如：p[title^=“abc”] 选取以abc开头的title元素
[属性名$=“属性值”]选取这个值以指定属性值结尾的元素
[属性名*=“属性值”]选取属性值以包含指定内容的元素

三、其他子元素选择器

1、:first-child 选择第一个子标签
2、:last-child 选中最后一个子标签
3、:nth-child(参数) 选中指定位置的子元素,该选择器后边可以指定一个参数,
指定要选中第几个元素,参数even表示偶数位置改变样式,参数odd表示奇数位置改变样式
（例如：选中p中的第三个元素
p:nth-child(3){} ）

			偶数变化：p:nth-child(even){}
			奇数变化：p:nth-child(odd){}

4、:first-of-type 选择指定类型的子元素（）
:last-of-type 选择指定类型的子元素
:nth-of-type 选择指定类型的子元素

四、兄弟元素选择器
1、后一个兄弟元素选择器：
作用：可以选中一个元素后紧挨着的指定的兄弟元素
语法：前一个+后一个(要紧挨着的后一个，中间不能隔开)
例如：span + p {}
2、选中后边的所有兄弟元素
语法：前一个 ~ 后一个{}