Hello MUI

基本选择器概述

包括以下四类： 1.通配符选择器 2.标签选择器 3.类选择器 4.id选择器

1.通配符选择器

通配符选择器用*号表示，作用范围最广，能匹配页面中的所有元素。其语法格式如下： *{属性1:属性值1;属性2:属性值2;......}

不好写示例，因为会导致全页面都被选中

2.标签选择器

标签选择器是指用HTML标签名称作为选择器，以便为页面中某一类标签指定统一的CSS样式。其语法格式如下： 标签名{属性1:属性值1;属性2:属性值2;……}

父代

本体

子代

孙代

兄弟

	
<div>父代
	<div>本体
		<div>子代
			<h5>孙代</h5>
		</div>					
	</div>	
	<div>兄弟</div>
</div>

	
h5{
	color: red;/* 上方只有孙代为h5标签 */
}

3.类选择器

类选择器是指用类名称作为选择器，以便为页面中某些标签指定为统一的CSS样式。其语法格式如下： .类名{属性1:属性值1;属性2:属性值2;……}

父代

本体

子代

孙代

兄弟

	
<div>父代
	<div class="select_class">本体
		<div>子代
			<div class="select_class">孙代</div>
		</div>					
	</div>	
	<div class="select_class">兄弟</div>
</div>

	
/* 本体、孙代、兄弟的类定义为 select_class*/
.select_class{
	color:red;
}

4.id选择器

id选择器用元素id名作为选择器，可以精确选中某个元素（注意不同元素id不能重复）。其语法格式如下： #id名{属性1:属性值1;属性2:属性值2;......}

父代

本体

子代

孙代

兄弟

						
<div>父代
	<div>本体
		<div id="grandson3">子代
			<div>孙代</div>
		</div>			
	</div>	
	<div>兄弟</div>
</div>

	
#grandson3{
	color:red;
}