(自用面试题)position的属性有哪些?

111 阅读1分钟

static(静态定位)

position默认值,无定位的意思;元素出现在标准流中,无边偏移;在布局时几乎不用。

relative(相对定位)

以其原来的位置为准进行定位,元素的位置用边偏移进行移动;原先的位置在标准流中继续占有。

absolute(绝对定位)

如果没有祖先元素或者祖先元素没有relative/absolute/fixed,以浏览器边界为准进行定位;如果有祖先元素并且祖先元素有relative/absolute/fixed,以最近一级有定位祖先元素为准进行定位,常见的方式为子绝父相,元素的位置用边偏移进行移动;原先的位置在标准流中不再占有。

fixed(固定定位)

以浏览器的可视窗口为准定位,元素的位置用边偏移进行移动,在屏幕滚动时不会改变;原先的位置在标准流中不在占有。

sticky(粘性定位)

以浏览器的可视窗口为准定位,元素的位置用边偏移进行移动;它相当于相对定位和固定定位的混合,未超过阈值时为相对定位,超过阈值变为固定定位。(这个特定阈值为top、right、bottom、left之一,即指定top、right、bottom、left四个阈值其中之一才可以使得sticky生效。)

inherit(继承)