分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 代码编程

[原创] css中的绝对定位和相对定位

发布时间:2023-09-06 01:17责任编辑:傅花花关键词:暂无标签

我对博客的认识是:记录问题,解决问题,分享知识。如果有轮子,我不需要造轮子。

    首先,定位无论是相对定位还是绝对定位,必须有一个参考项,而这个参考项,专业术语称之为 包含块,这里的包含块是指在定位时候的包含块,具体有关包含块的概念和意义自行研究。

 对于定位postition属性而言,包含块的判定如下(记住就好,理解了就更好):

1.根元素的包含块,根元素一般是html元素,有些浏览器会使用body作为根元素,大多数浏览器,初始包含块是一个视窗大小的矩形

2.非根元素的包含块,如果该元素的position是relative或static,它的包含块是最近的块级框,表的单元格或行内块的内容边界

3.非根元素的包含块,如果该元素的position是absolute,则包含块为最近的position不是static的祖先元素。简单来说,它的包含块会从父级元素一直向上查找,找到第一个position不是static的元素为止。

4.fixed定位很简单,类似与absoulte,但是它的包含块就是浏览器窗口,相对来说简单很多。常见的应用比如固定导航,回到顶部。

参考

1.基础教程

2.详解CSS position属性

3.css的float属性

4.CSS3包含块及其定位判定

[原创] css中的绝对定位和相对定位

原文地址:http://www.cnblogs.com/jasonHome/p/7667644.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved