答:CSS 中总共有 5 种定位方式,它们分别是:
Static Position
:静态定位Relative Position
:相对定位Absolute Position
:绝对定位Fixed Position
:固定定位Sticky Position
:粘性定位默认值。没有定位,元素出现在正常的流中(忽略 top
, bottom
, left
, right
或者 z-index
声明)。
生成相对定位的元素,相对于其正常位置进行定位。
因此,left:20
会向元素的 LEFT
位置添加 20
像素。
生成绝对定位的元素,相对于 static
定位以外的第一个父元素进行定位。
元素的位置通过 left
, top
, right
以及 bottom
属性进行规定。
生成固定定位的元素,相对于浏览器窗口进行定位。
元素的位置通过 left
, top
, right
以及 bottom
属性进行规定。
粘性定位,该定位基于用户滚动的位置。
它的行为就像 position:relative
; 而当页面滚动超出目标区域时,它的表现就像 position:fixed
;,它会固定在目标位置。
注意: Internet Explorer
, Edge 15
及更早 IE
版本不支持 sticky
定位。 Safari
需要使用 -webkit- prefix
。
本文作者:叶继伟
本文链接:
版权声明:本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!