HTML基础笔记之伪类选择器

伪类选择器

	同一个标签根据其不同状态会显示不同的样式的就是伪类选择器。

动态伪类选择器

• 链接伪类选择器
  :link{} 初始状态
  :visited{} 访问过后的状态

• 用户行为选择器
  :hover{} 鼠标移入的状态
  :active{} 鼠标按下的状态
  :focus{} 选中获取了焦点(光标在哪里跳动)的元素，可以和 表单结合使用

目标伪类选择器

	 :target{}	当a被点击时，对应选择器发生改变 		 	

此时，分别点击第一，二，三部分得

结构伪类选择器

	 :first-child{}	选中父元素的第一个子元素
	 :last-child{}	选中父元素的最后一个子元素
	 :nth-child(n){}	n是从0开始的,选中父元素的第n个子元素
		 2n		偶数列 even
		 2n-1	奇数列 odd
	 :only-child{}	选中只有本身一个同级的元素
	 :nth-last-child(n){} 	选中父元素的倒数第n个子元素
	 :nth-of-type(n){}	指定类型的第n个元素
	 	 first-of-type{}	指定类型的第一个元素
	 	 last-of-type{}	指定类型的最后一个元素
	 :nth-last-of-type(n){}	同类型中的倒数第n个同级兄弟元素
	 :only-of-type{}	 指定元素中只有一个同类型的元素

UI元素状态伪类选择器

	 :enabled{}	选中可以输入的元素
	 :disabled{}	选中不可输入的元素
	 :checked{}	选中被选中的元素
	 :selection{}	被用户选中的内容处于高亮的状态

其他

	 :root{}	选中html(根元素)
	 :empty	选中空元素

css3中伪类选择器和伪对象选择器的区别

• 伪类（：）一般反映无法在CSS中轻松或者可靠检测到的某个元素的状态或者属性； 伪元素（::）表示DOM外部的某种文档结构。
• 伪类 按现在的规范应当书写成 :weilei伪元素 按现在的规范 应当书写成 ::weiyuansu但是 以前规范不明确的时候 伪元素 和 伪类 都是写成 :weiyuansu :weilei为了兼容过去的写法所以 你的伪元素 写成一个引号的形式 也是可以被解析的
• 伪元素主要有：E:first-letter/E::first-letter E:first-line/E::first-line E:before/E::before E:after/E::after E::placeholder E::selection
• 伪类主要有：E:link E:visited E:hover E:active E:focus E:lang(fr) E:not(s) E:root E:first-child E:last-child E:only-child E:nth-child(n) E:nth-last-child(n) E:first-of-type E:last-of-type E:only-of-type E:nth-of-type(n) E:nth-last-of-type(n) E:empty E:checked E:enabled E:disabled E:target @page:first @page:left @page:right
• 单冒号 双冒号 主要是为了区别 伪元素还是伪类

小结

以上并不完整，欢迎大家批评指正。