<!-- 整体说明： 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 lang="zh-CN"> <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" id="box">马玉刚</div> <div class="box">李苹</div> </body> </html>