HTML5+CSS3自学笔记01-CSS2选择器

一、基本选择器

1.标记选择器

Web页面的框架是由HTML元素标记组成,CSS标记选择器就是用来声明各个元素的标记使用哪种CSS样式,HTML中的每一个标记都是一个标记选择器


	
		
		CSS选择器		
		
		
	
	
		
		

类选择器

类选择器

第一种样式

第二种样式

同时使用两种样式


3.ID选择器

与类选择器一样,ID选择器是通过HTML元素的ID属性来声明CSS样式,ID选择器的名称可以自定义,但名称前必须添加,注意ID选择器的属性值,在整合HTML文档中只能出现一次.


	
		
		CSS选择器
		
		
		
	
	
		
		

第一个ID选择器

第二个ID选择器


二、符合选择器

符合选择器是针对基本选择器而言,有两个或多个基本选择器,通过不同的方式连接而成的选择器就是符合选择器。符合选择 器又分为"交集"选择器、“并集”选择器和后代选择器

4.交集选择器

“交集”选择器是由两个选择器直接连接构成,其结果就是选中各自元素范围内的交集,其中第一个必须是标记选择器,第二个必须是ID选择器或者类选择器,这两个选择器之间不能有空格,必须连续书写。“交集”选择器第一个必须是标记选择器,但有时也会是类别选择器,即两个都是类别选择器,这种情况在一些浏览器中是允许的,但有些浏览器并不兼容,如必须使用,需要对浏览器的兼容性进行充分的测试


	
		
		符合选择器
		
	
	
		
		
红底白字
绿底黑字
蓝底白字

5.并集选择器

“并集”选择器可以同时选中各个基本选择器所选择的范围,任何形式的选择器都可以组成“并集”选择器,多个选择器之间使用逗号连接


	
		
		符合选择器
		
	
	
		
		

第一行数据

第二行数据

第三行数据


6.后代选择器

HTML元素之间可以嵌套,而对于这些嵌套的元素,CSS也有与其对应的后代选择器。后代选择器由多个标记选择器组成, 但是它又不同于“交集”选择器或者“并集选择器”。后代选择器规定外层的标记写在前面,内的的标记写在后面,标记之 间用空格分隔,如果标记之间存在嵌套关系,那么内层的标记就视为外层标记的嵌套


	
		
		符合选择器
		
	
	
		
		

嵌套标记的颜色

没有嵌套标记的颜色



你可能感兴趣的:(HTML5+CSS3自学笔记01-CSS2选择器)