1、盒子模型概述:
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsISPrdEZwZ1Rh5WNXp1bwNjW1ZUba9VZwlHdsATOfd3bkFGazxCMx8VesATMfhHLlN3XnxCMwEzX0xiRGZkRGZ0Xy9GbvNGLpZTY1EmMZVDUSFTU4VFRR9Fd4VGdsYTMfVmepNHLrJXYtJXZ0F2dvwVZnFWbp1zczV2YvJHctM3cv1Ce-cmbw5SO0kTY0QDN0QWZyAzNjhDM5UmZyMTZzQzY5IWZ0MDMw8CX4AzLchDMxIDMy8CXn9Gbi9CXzV2Zh1WavwVbvNmLvR3YxUjL1M3Lc9CX6MHc0RHaiojIsJye.png)
2、内边距:
代码演示:
index.html
css:
实现的效果:
3、边框
示例:
index.html:
效果:
4、外边距
简单示例:
结合外边距、内边距、边框:
css:
5、外边距合并
6、盒子模型应用
绘制一个网站框架:
index.html代码:
css代码:
1、盒子模型概述:
2、内边距:
代码演示:
index.html
css:
实现的效果:
3、边框
示例:
index.html:
效果:
4、外边距
简单示例:
结合外边距、内边距、边框:
css:
5、外边距合并
6、盒子模型应用
绘制一个网站框架:
index.html代码:
css代码: