<!--
整体说明：
1.CSS的三种引入方式
（1）行内样式
（2）内接样式
（3）外接样式
2.CSS的基本选择器
（1）id选择器 （引用方式：#id）
（2）标签选择器（引用方式：标签名字）
（3）类选择器（引用方式：.类名）
3.CSS的高级选择器
（1）后代选择器
（2）子代选择器
（3）组合选择器
<div>
<p>
<span></span>
</p>
</div>
（4）交集选择器
-->
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>CSS的三种引入方式和基本选择器</title>
<style>
/*CSS样式优先级：行内样式 1000 > id选择器 100 > 类选择器010 > 标签选择器 001*/
<!--以下是3种基本选择器 -->
/*标签选择器*/
div{
color:#ff6700;
}
/*id选择器*/
#box{
color: red;
}
/*类选择器*/
.box{
color: chartreuse;
font-size: 30px;
}
.active{
color: cadetblue;
}
</style>
</head>
<body>
<div class="box active" >马玉刚</div>
<div class="box">李苹</div>
</body>
</html>