首页 > 其他 > 详细

定位的分类、特点与应用

时间:2020-03-05 11:58:46      阅读:65      评论:0      收藏:0      [点我收藏+]

一、相对定位 position:relative;
特点:
不脱离标准文档流,可以调整元素
参考点:
以原来的位置为参考点



二、绝对定位 position:absolute;
特点:
1、脱离标准文档流,不在页面占位置
2、层级提高,压盖现象
参考点:
1、单独给一个盒子设置绝对定位,以根元素页面左上角为参考点
2、相对于最近的非static祖先元素定位,如果没有非static祖先元素,那么以页面根元素左上角进行定位

网站中实战应用:
“子绝父相”设计理念:父元素设相对定位,子元素根据父元素设置绝对定位


 

 

三、固定定位 position:fixed;
特点:
1、脱离标准文档流
2、一旦设置固定定位,在页面中滚动网页,固定不变
参考点:
以浏览器的左上角为参考点
应用:
小广告,回到顶部,固定导航栏

定位的分类、特点与应用

原文:https://www.cnblogs.com/nanjo4373977/p/12419110.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!