CSS中的定位属性可以让我们更加自由灵活地控制元素在页面中的位置与布局。主要有以下几个常见的定位属性:
position: static | relative | absolute | fixed | sticky;
top: value;
bottom: value;
left: value;
right: value;
z-index: value; 其中,position表示元素的定位类型,static是默认值,表示元素按照文档流的形式进行布局。 relative表示相对定位,相对于自身原来的位置进行定位,其他元素不会受到影响。 absolute表示绝对定位,相对于其最近的已定位祖先元素进行定位,如果没有已定位的祖先元素,则相对于文档的主体进行定位。 fixed表示固定定位,相对于浏览器窗口进行定位。 sticky表示粘性定位,元素在跨越特定阈值前为相对定位,之后为固定定位。
top、bottom、left、right分别表示元素与其相对定位的参考位置(如父元素、文档主体、浏览器窗口等)的距离。这些值可以使用像素(px)、百分比(%)等单位进行设置。
z-index表示元素的层级,数值越大越高,可以实现叠放效果。