样式表（课堂代码）

 1 <head>
 2 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 3 <title>无标题文档</title>
 4 <!--<style type="text/css">
 5 p,div
 6 {font-size:36px;必须写px
 7 color:#36F;
 8 background-color:#3C3}
 9 </style> -->
10 
11 <link href="Untitled-1.css" rel="stylesheet" type="text/css" />
12 </head>
13 
14 <body>
15 <div class="qq">div层标签，<p>默认占用一行</p></div>
16 <span style="background-color:#66F">span层标签，默认多少占用多少</span><br />
17 <p class="qq">今天天气很不错</p><p id="qq">1231312</p>
18 <a href="http://360.com" target="new">360网站</a>
19 <a href="http://www.baidu.com" target="new">百度</a>
20 <a href="http://www.tianmao.com" target="new">天猫</a>
21 </body>

新建相关CSS：

 1 @charset "utf-8";
 2 /* CSS Document */
 3 <style>
 4 *
 5 {margin:0px;/*边距*/
 6 padding:0px;}/*间距*/
 7 .qq
 8 {
 9     color:#00F;
10     background-color:#0FF;
11 }
12 .qq p
13 {
14     color:#63F;
15     background-color:#3C6;
16 }
17 
18 #qq{
19     color:#C93;
20     background-color:#66F;
21     text-decoration:none;
22         }
23 a:link
24 {
25     color:#000;
26     text-decoration:none;}
27 a:visited
28     {
29     color:#F0F;
30     text-decoration:none;}
31 a:hover{
32     color:#F00;
33     text-decoration:underline;}
34 a:active{
35     color:#6F0;
36     text-decoration:underline;}
37 </style>

效果为：