355.html布局

或许第一次看到html语言的人都是一头雾水，对于h1到h6的标题可能都能理解，但里面有那么多的div和span，不知道是什么意思。

网页经常经过精心的布局，而布局就必须理解块元素和内联元素(inline)的区别。

块的特点是：

• 默认占满整个浏览器宽度
• 上下边界各有一个换行
• 高度因内容而异

内联元素的特点是：

• 宽度因内容而异
• 上下没有换行
• 高度几乎固定

而div默认用来对网页进行大的分区，而span通常用来做内联元素的标记。

块元素一块一块从上向下排列，像一个个的厚箱子摞在一起。而内联元素在包含它的父块中，从左上往右下自动换行排列。

浏览器变窄时，内联元素原来的宽度不够，就会自动换行多出几行。而它的父块也会变高。

如果只是像千层饼，那显然也做不出好网页。而块元素必须能够改变宽度，宽度改变后，就可以两个块元素并排分布，类似分栏那种。

并且html还有浮动、绝对、相对的位置模式。