html/WebRoot/css/cssdexuanzeqi.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
	<style type="text/css">
	/* 
	* CSS的选择器
			* 告诉CSS的代码作用在哪个标签上。
				* 基本选择器
					* 标签名选择器		div{}	span{}
					* 类选择器：在HTML的标签上，提供了属性	class，定位到div的标签（美工经常使用的方式）
					* 写法：	.class的名称	(.hehe{CSS的代码})
					* 作用设置不同的标签，具有相同的样式	
				* ID选择器
					* 在HTML的标签上，提供的属性 设置样式
					* 写法：	#id的名称	(#haha{CSS的代码})
					* 一般情况下：设置不同的ID
					* 一般情况下给js语言来使用。(设置样式的时候使用class选择器)	
				* 优先级：（特殊情况下）
							* 标签选择器 < 类选择器 < ID选择器 < style属性	
							作用	
					* 扩展选择器
				*/
		/*
			练习类选择器
		*/
	/* 	这里很明显是用来指定所有div 下class为为haha的内容
		div.haha{
			background-color: red;
			color: blue;
		} 
		.haha{
			background-color: red;
			color: blue;
		}
		
		#p_id{
			background-color: red;
			color: blue;
		}
		*/
		
		/* * 组合选择器：对多个不同的选择器进行相同的样式
			* 写法：在多个不同的选择器之间用 ,	隔开
			组合选择器
			div,#p_id,.haha{
			background-color: red;
			color: blue;
		} */
	</style>				
</head>

<body>
	<!--注意！ html中文本中的空格&nbsp另外p标签段落中的多个空格会被浏览器解析成一个处理 -->
	<div class="haha">我是区块1</div> <div style="background-color: green;cue: yellow">我是区块2</div>
	<div class="haha">我是区块3</div>
	<span class="haha">我是区块4</span>
	<p id="p_id">疑是地上霜</p>
	<!-- 注意 这是有序哒  记不住。。 -->
	<ol id="p_id">
		<li>多多复习</li>
		<li>这是有序</li>
		<li>哒虽然我</li>
		<li>不肯定唉</li>
	</ol>
</body>
</html>