定位指的就是将指定的元素摆放在页面的任意位置,通过定位可以任意的摆放元素。 定位指的就是将指定的元素摆放在页面的任意位置,通过定位可以任意的摆放元素.
通过position属性来设置元素的定位。可选值: 通过Place属性来设置元素的定位.可选值:
static:默认值,元素没有开启定位。
relative:开启元素的相对定位。
absolute:开启元素的绝对定位。 静态:默认值,元素没有开启定位。亲缘关系:开启元素的相对定位.绝对值:开启元素的绝对定位。
fixed:开启元素的固定定位(也是绝对定位的一种)。 固定:开启元素的固定定位(也是绝对定位的一种)。
相对定位
当元素的position属性设置为relative时,则开启了元素的相对定位。 当元素的位置属性设置为相对时,则开启了元素的相对定位。
当开启了元素的相对定位以后,而不设置偏移量时,元素不会发生任何变化。
相对定位是相对于元素在文档流中原来所处的位置。
只有相对定位的元素不会脱离文档流。(可以理解为灵魂出窍?)
相对定位会让元素提高一个层级。可以盖住其他固定的元素。 相
相对定位不会改变元素的性质,块元素还是块元素(宽度是父元素的全部),内联元素还是内联元素(还是不能设置宽高)。
当开启了元素的定位(position属性值是一个非static的值)时,可以通过left/right/top/bottom四个属性来设置元素的偏移量(距离)。
left:元素相对于其定位位置左侧的偏移量。right:元素相对于其定位位置右侧的偏移量。top:元素相对于其定位位置上边的偏移量。bottom:元素相对于其定位位置下边的偏移量。
通常偏移量只需要使用两个就可以对一个元素进行定位。 一般选择水平方向的一个偏移量和垂直方向的偏移量来为一个元素进行定位.
绝对定位
开启绝对定位,会使元素完全脱离文档流。 开启绝对定位,会使元素完全脱离文档流.
开启绝对定位以后,如果不设置偏移量,则元素的位置不会发生变化。
绝对定位是相对于离它最近的开启了定位(只要position屋性值不是none)的祖先元素进行定位的,如果所有的祖先元素都没有开启定位,则会相对于浏览器窗进行定位。 绝 可说成绝对定位元素会相对于它的包含块进行定位.
包含块:
对于绝对定位元素来说,包含块就是离它最近的开启了定位的块祖先元素。 如果没有开启定位的祖先元素,则其包含块是网页中的初始包含块.html ·绝对定位会使元素提升-个层级.
绝对定位会改变元素的性质,内联元素变成块元素,块元素的宽度和高度默认都被内容撑开(绝对定位下)。
行内变块,块宽高被内容撑开。 一般情况,我们为一个元素开启了绝对定位,会时为它的父元素开启相对定位.
固定定位
·固定定位永远都会相对于浏览器窗口进行定位。
当元素的position属性设置为fixed时,则开启了固定定位 它也是一种绝对定位,它的大部分特点都
元素的固定定位。(IE6不支持固定定位) 和绝对定位一样,但不同的特点是:
固定定位会—直固定在浏览器窗口的某个位置,不会随滚动条滚动。
粘性定位
position:sticky 仅作了解