本文深入解析CSS中的定位属性，包括static, relative, absolute和fixed的区别与应用场景。static是默认值，relative进行相对定位，absolute实现绝对定位并脱离文档流，fixed则相对于浏览器窗口定位。同时，详细介绍了z-index属性，用于控制层叠顺序，值越大，显示优先级越高。理解这些概念对于前端开发至关重要。
一、属性值：
1.static （默认值）没有定位
2.relative 相对定位
无论是标准元素还是浮动元素，相对于它没有定位前的位置进行偏移
top和bottom left和right各自都只能设置一个
3.absoule 绝对定位
会脱离标准文档流
变成行内块级元素，宽高由内容的宽高决定
如果有已经定位的祖先元素，则以最近定位的祖先元素为参照进行定位
如果没有设置定位的祖先元素，则根据可视窗口（内容）进行定位
4.fixed 固定定位
脱离标准文档流，变成行内块级元素
相对于浏览器窗口进行定位，固定在窗口一个位置，不会随着网页的滑动而改动
二、定位属性的附属属性值：
top left bottom right
三、z-index属性
指定层叠顺序 值越大显示优先级越高
值的范围是 -1到9999，默认值是auto
如果父元素有z-index，就和父元素的值一样，不然就为0
必须和position结合使用
扫一扫
376
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
