1 <html lang="en"> 2 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title></title> 8 <style> 9 /* 连接伪类 选择器 */ 10 11 a { 12 font-size: 10px; 13 } 14 /* 未访问连接的时候 */ 15 16 a:link { 17 color: pink; 18 } 19 /*已访问连接的时候*/ 20 21 a:visited { 22 color: hotpink; 23 } 24 /* 鼠标点击移上去的时候 */ 25 26 a:hover { 27 color: rebeccapurple; 28 } 29 /* 单鼠标点击的时候 */ 30 31 a:active { 32 color: brown; 33 } 34 /* 结构伪类选择器 */ 35 /* 选择第一个 */ 36 /* li:first-child { 37 color: red; 38 }*/ 39 /* 选择最后一个 */ 40 /*li:last-child { 41 color: red; 42 }*/ 43 /* 奇偶选择伪类 */ 44 /* 偶数选择器 */ 45 /* li:nth-child(odd) { 46 color: teal; 47 } */ 48 /* 奇数选择器 */ 49 /* li:nth-child(even) { 50 color: brown; 51 } */ 52 /* 2n+1 奇数 2n 偶数 */ 53 /* li:nth-child(2n+1) { 54 color: brown; 55 }*/ 56 /* 目标伪类选择器 */ 57 </style> 58 </head> 59 60 <body> 61 <!-- 多媒体标签 --> 62 <!-- audio ogg,mp3 ,wav 等音频格式--> 63 <a href=""> 我是一只猫</a> 64 <ul> 65 <li>1</li> 66 <li>2</li> 67 <li>3</li> 68 <li>4</li> 69 <li>5</li> 70 <li>6</li> 71 <li>7</li> 72 <li>8</li> 73 </ul> 74 </body> 75 76 </html>