定位 position

发布时间 2023-07-22 16:26:10作者: pocsan
定位 position一共有五个属性值静态定位/相对定位/固定定位/绝对定位/粘性定位position: static/relative/fixed/absolute/sticky;利用top left right bottom 对元素进行position:relative相对样式需要配合left、top、right、bottom这些定位属性才能生效。
relative 相对的是容器自身的屏幕坐标0,0点。容器位置发生位移后,原来占据的空间依然保留。默认会覆盖没有定位的容器。绝对定位的元素会脱离文档流。绝对定位的参照点为,有定位设置的离他最近的祖先元素的0,0点坐标。绝对定位的容器默认会覆盖没有定位的容器。固定定位的元素是相对于浏览器视口定位的,这意味着即使页面发生滚动,它也始终保持在同一个位置。top.right、bottom和left属性被用来定位元素,但不是必须的。粘性定位初始状态相当于static定位。相对于父容器的定位条件符合时,容器变现为固定定位。top、right. bottom或left至少声明一个,粘性定位才能生效。