盒模型
3 种定位机制
CSS 中有 3 种基本的定位机制：普通流、浮动、绝对定位。除非专门制定了，否则所有的框都在普通流中定位——普通流中元素框的位置由元素在 HTML 中的位置来决定。
- 块框： p、h1、div 等元素是块元素，意味着显示为一块内容，即块框。
- 行内框： strong、span 等元素是行内元素，意味着其内容显示在行中，即行内框。
可以使用display改变生成的框的类型。
块级框从上到下地垂直排列，框之间的垂直距离由框的垂直外边距计算出来。
而行内框则是在一行中水平排列，可以使用水平内边距padding、边框border、外边距margin调整水平间距。但是，垂直内边距padding、边框border、外边距margin是不影响行内框的高度的，同样，显式的设置高度或宽度也没什么用，**唯一的方法是修改行高 line-height **。
由一行形成的水平框称为行框，行框的高度总是足以容纳它包含的所有行内框。
对行内框的总结：修改行内框尺寸的唯一方法是：修改行高 或者 水平边框、内边距、外边距。
CSS 2.1 允许把元素的 display属性设置为 inline-block，即让元素向行内元素一样水平的依次排列，但是，框的内容任然符合块级框的行为。