盒子模型
Posted sotired
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了盒子模型相关的知识，希望对你有一定的参考价值。
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>
以上是关于盒子模型的主要内容，如果未能解决你的问题，请参考以下文章
初学css盒子模型，对于盒子的使用不是很明白，请问这样的盒子布局怎么写？
CSS课程网站 Banner 制作 ② ( Banner 栏版心盒子测量 | Banner 版心盒子模型左侧导航栏代码示例 )