盒子模型

 1 <!doctype html>
 2 <html>
 3     <head>
 4         <title>盒子模型</title>
 5         <meta charset="utf-8">
 6         <meta name="keywords", content="">
 7         <meta name="description", content="">
 8         <style type="text/css">
 9             li{
10                 list-style-type:none;
11             }
12             *{margin:0;padding:0;} /*通配符选择器,选择所有的功能标签设置样式*/
13             .box{                  /*盒子模型 width,height,margin(宽高可用百分比), padding,border*/
14                 width:200px;
15                 height:200px;
16                 background:red;
17                 margin:200px;
18                 padding:200px;
19                 border:5px solid #003300;
20             }
21         </style>
22     </head>
23     <body>
24         <div class="box"></div>
25         <ul>
26             <li>哈哈哈</li>
27             <li>哈哈哈</li>
28             <li>哈哈哈</li>
29             <li>哈哈哈</li>
30             <li>哈哈哈</li>
31         </ul>
32     </body>
33 </html>