1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Insert title here</title> 6 <style type="text/css" > 7 p{ 8 color:blue; 9 } 10 #one { 11 color:red; 12 } 13 .two{ 14 color:green; 15 } 16 #one,.two{ 17 color:yellow; 18 } 19 a:link{ 20 color:red; 21 } 22 a:visited{ 23 color:green; 24 } 25 a:hover{ 26 color:blue; 27 } 28 a:active{ 29 color:orange; 30 } 31 </style> 32 <link type="text/css" rel="stylesheet" href="b.css"/> 33 </head> 34 <body> 35 <!-- 36 标签选择器: 37 语法:标签名{ 38 属性键:属性值; 39 } 40 ID属性唯一标识符. 41 要确保页面中id树形图的唯一性. 42 ID选择器: 43 语法: #ID{ 44 属性键:属性值; 45 } 46 class属性可以随意重复. 47 语法: .class{ 48 属性键:属性值; 49 } 50 选择器分组: 51 语法: 选择器1,选择器2....{ 52 属性键:属性值; 53 } 54 伪类选择器:指的是选择的某个标签的某种状态 55 常见状态有4种,a标签最全 56 l link 没有点击过的状态 57 v visited 访问过的状态 58 h hover 鼠标悬浮 59 a active 激活状态(鼠标点下去没有谈起) 60 --> 61 <p id="one">张三</p> 62 <p>李四</p> 63 <p class="two">王五</p> 64 <p class="two">赵六</p> 65 <a href="01_结合方式.html">01_结合方式.html</a> 66 67 </body> 68 </html>