2019-12-14   

姓名：胡天鸿     这是我写文章的第四天。

元素的定位属性

元素的定位属性要包括定位模式和偏移两部分。

1，边偏移

top          描述偏移量，定义元素相对于其父元素上边线的距离

bottom     底部偏移量，定义元素相对其父元素下边线定的距离

left            左侧偏移量，定义元素像相对其父元素左边的距离

right          右侧偏移量，定义元素相对其父元素右边线的距离

2，定位模式

在css中，position属性定义元素的定位模式，其基本语法格式如下：

选择器{posittion:属性值；}

自动定位    相对定位     绝对定位     固定定位

（1）static       自动定位（默认定位方式）

（2） relative   相对定位，相对定位其原文档流的位置进行的位置进行定位

（3）absolute   绝对定位，相对于其上一个已经定位的父元素进行定位

（4）fixed        固定定位，想对于浏览器窗口进行定位。

3.CSS position 属性

通过使用position 属性，我们可以选择 4 种不同类型的定位，这会影响元素框生成的方式。

position 属性值的含义：

（1）static

元素框正常生成。块级元素生成一个矩形框，作为文档流的一部分，行内元素则会创建一个或多个行框，置于其父元素中。

（2）relative

元素框偏移某个距离。元素仍保持其未定位前的形状，它原本所占的空间仍保留。

（3）absolute

元素框从文档流完全删除，并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭，就好像元素原来不存在一样。元素定位后生成一个块级框，而不论原来它在正常流中生成何种类型的框。

（4）fixed

元素框的表现类似于将 position 设置为 absolute，不过其包含块是视窗本身。