有趣的盒子

在敲牛腩的过程中，敲到登录，我想自己换个LOGO，加些好看的图片，自己花了一天的时间研究这些图的位置方法，结果还是以失败告终，自己加的图片达不到自己想要的效果，我只好老老实实回去跟着老师敲，我相信总有一天我能够做自己想要的网站的！！

下面说盒子。

1.what？

什么是盒子？

生活中的盒子是用来盛放物品的

网页中的盒子是网页设计中经常用到的CSS技术所使用的一种思维模型，它也是用来装东西的，Content就是它要装的东西

2.Characteristic!

CSS盒子模型属性：

内容（content）、填充（padding）、边框（border）、边界（margin）

内容（content）就是盒子里装的东西。常指文字、图片等，或者是小盒子（DIV嵌套）。

填充（padding）就是怕盒子里装的东西损坏而加的泡沫或者其他抗震辅料。

边框（border）就是盒子本身。

边界（margin）的意思是盒子摆放的时候不能全部堆在一起，要留一定的空隙保持通风，同时也方便取出。

3.difference！

生活中的盒子，如果里面盛放的东西过多就会把盒子撑坏。

CSS盒子具有弹性，里面东西大过盒子本身也不会把它撑坏，顶多过把它撑大！

4.How?

如此有意思的盒子，该怎么使用呢？来看下面这张图

内容属性：宽=width 高=height
内填充属性（内容与边框之间的距离）：padding
外边距属性：margin（使用该属性的时候注意浏览器的兼容性）

边框属性：border

内填充与边界的规则：
如果有四个参数：表示上右下左,也可以单单指定某个方向
如果只有一个参数：表示上右下左
如果有两个参数： 第一个参数表示上下 第二个参数表示左右
如果三个参数：表示上 左右 下

5.小结

对盒子的理解暂时就这么多，相信继续走下去我们会学到更多的东西！GO FIGHTING！