作用:定位
position:absolute;
position:fixed;
position:relative;
position:static;
position:inherit;
用法 | 名称 | 脱标 | 占有位置 | 移动位置 | z-index | 应用场景 |
---|---|---|---|---|---|---|
position:static; |
静态定位默认值 | 否 | 不可以 | |||
position:relative; |
相对定位 | 否 | 不占有位置 | top, left, bottom, right来设置 | 可以 | |
position:absolute; |
HTML页面绝对定位 | 是 | 占有位置 | top, left, bottom, right来设置 | 可以 | |
position:fixed; |
窗口固定定位(拼爹) | 是 | 不占有位置 | top, left, bottom, right来设置 | 可以 | |
position:inherit; |
集成父类的属性值 | 父亲有什么它就有什么。 | 不可以 | |||
position: sticky; |
粘性定位 | 否 | 占有位置 | 不可以 | ||
父级要用相对定位relative、当前级用绝对定位absolute |
相对定位 | 父级不脱标 | 不占有位置 | 当前级top, left, bottom, right来设置 | 可以 | 右上角红点 |