Question

position属性有哪4种取值?有何区别?

Answer 1

position属性有static、relative、absolute和fixed取值。区别是static，默认值，没有定位。relative，生成相对定位的元素，通过top，left，right的设置相对于其正常位置进行定位。

absolute，生成绝对定位的元素，相对于static定位以外的第一个父元素进行定位。fixed，生成绝对定位的元素，相对于浏览器窗口进行定位。

定位类型

大多数情况下，height和width被设定为auto的绝对定位元素，按其内容大小调整尺寸。但是，被绝对定位的元素可以通过指定top和bottom，保留height未指定，来填充可用的垂直空间。它们同样可以通过指定left和right并将width指定为auto来填充可用的水平空间。

定位元素是其计算后位置属性为relative，absolute，fixed或sticky的一个元素。相对定位元素是计算后位置属性为relative的元素。绝对定位元素是计算后位置属性为absolute或fixed的元素。粘性定位元素是计算后位置属性为sticky的元素。

如果top和bottom都被指定，top优先。如果指定了left和right，当direction设置为ltr时left优先，当direction设置为rtl时right优先。