一、定位属性的基本情况
使用position属性对元素进行定位：
position属性
值：static | absolute | fixed | relative
初始值：static
运用范围：所有元素
继承值：无
计算值：根据指定确定
static：元素框正常生成。块级元素生成一个矩形框，作为文档流的一部分，行内元素则会创建一个或多个行框，置于其父元素中。
relative：元素框偏移某个距离。元素仍保持其未定位前的形状，它原本所占的空间仍保留。
absolute：元素框从文档流完全删除，并相对于其包含块定位，包含块可能是文档中的另一个元素或者是初始包含块。元素定位后生成一个块级框，而无论原来它在正常流中生成何种类型的框。
fixed：元素框表现类似于absolute，不过其包含块是视窗本身。
二、解释定位元素的包含块
假设有如下所示HTML结构：
样式同上，效果截图如下：
块级元素的情况
行内元素的情况
结论：一个非根元素，如果是绝对定位，则它的包含块设置为离它最近的position值不是static的祖先元素。
如果这个祖先元素是块级元素，包含块则设置为该祖先元素的边框的内边界。
如果这个祖先元素是行内元素，包含块则设置为该元素的内容边界。以从左向右读的语言为例，该元素的上、左边界是其祖先元素中第一个框内容区的上、左边界；该元素的下、右边界是其祖先元素中最后一个框内容区的下、右边界。
三、浏览器对作为定位元素的内联元素的处理
对于块级元素，无论是否定位，元素均作块级元素处理，而行内元素绝对定位时，当做块级元素处理。假如有如下HTML：
<span class="father margin" id="p_a" style="width: 90%; height: 80px; ">绝对定位的行内父元素.绝对定位的行内父元素.绝对定位的行内父