ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

css-position: static / absolute / fixed / relative

2022-07-06 21:05:27  阅读:172  来源: 互联网

标签:定位 right 属性 对象 relative static position fixed absolute


static:静态 absolute:绝对定位 fixed:固定 relative:相对定位

static :

无特殊定位,对象遵循HTML定位规则

absolute :

将对象从文档流中拖出,使用left,right,top,bottom等属性进行绝对定位。与其最接近的一个最有定位设置的父级对象进行绝对定位。

如果父级对象没有设置定位属性,那么将遵循HTML的定位规,以body的左上角为参考进行定位。而其层叠通过z-index属性定义。此时对象不具有边距,但仍有补白和边框。

对象可层叠。

relative :

对象不可层叠,但将依据left,right,top,bottom等属性在正常文档流中偏移位置

fixed :

生成绝对定位的元素, 相对于浏览器窗口进行定位。可以通过设置 "left", "top", "right" 以及 "bottom" 属性给目标元素定位。

position为absolute与fixed两者的共同点和不同点:

共同点是:元素都脱离了标准流,均不再占据空间;

不同点是:定义为absolute的元素会随着滚动条的拖动而变化,定义为fixed的元素并不会随着滚动条的拖动而变化。

 

参考链接:https://blog.csdn.net/chengxing1305/article/details/5432650

参考链接:https://blog.csdn.net/sinat_41747081/article/details/88384335

标签:定位,right,属性,对象,relative,static,position,fixed,absolute
来源: https://www.cnblogs.com/duiyuedangge/p/16452467.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有