position的值，relative和absolute分别相对于什么定位

最新推荐文章于 2024-03-09 11:20:08 发布
原创 最新推荐文章于 2024-03-09 11:20:08 发布 · 2.3k 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#定位 #position #absolute #relative

本文详细介绍了CSS中的五种定位方式：absolute、fixed、relative、static和sticky。每种定位方式都有其独特之处，如absolute和fixed生成绝对定位元素，relative生成相对定位元素等。
absolute：生成绝对定位的元素， 相对于最近一级的定位不是 static 的父元素来进行定位。

fixed：（老IE不支持）生成绝对定位的元素，通常相对于浏览器窗口或 frame 进行定位。

relative：生成相对定位的元素，相对于其在普通流中的位置进行定位。

static： 默认值。没有定位，元素出现在正常的流中

sticky：生成粘性定位的元素，容器的位置根据正常文档流计算得出
一文读懂css【css3】绝对（absolute）定位和相对（relative）定位 相对定位是相对谁定位的 绝对定位又是根据谁绝对定位的 子绝父相 包含块
念兮为美
07-31 6461
我们在开发的过程中，经常会使用到相对定位和绝对定位，但我们有时对这两个定位不是很熟悉，往往会弄混，分不清什么是相对定位，什么又是绝对定位。那么，这篇文章便详细解说他们的区别。相对定位是元素相对其起始位置的定位，那么什么是起始位置呢？绝对定位是相对包含块来定位的，那么，那么什么又是包含块？我们清楚，绝对定位有子绝父相这个词，那么，它是什么意思呢？这里的所有疑问，都会在这篇文章中，讲的非常清楚...
CSS position属性absolute relative等五个值的解释
12-13
《CSS position属性详解：absolute, relative及其他值》 在网页设计中，CSS（层叠样式表）的position属性是至关重要的，它决定了元素在页面上的布局方式。position属性有五个基本值：static、relative、absolute、...
position的值， relative和absolute分别是相对于谁进行定位的
weixin_30332241的博客
09-04 605
absolute:生成绝对定位的元素， 相对于最近一级的 定位不是 static 的父元素来进行定位。 fixed（老IE不支持）生成绝对定位的元素，通常相对于浏览器窗口或 frame 进行定位。 relative生成相对定位的元素，相对于其在普通流中的位置进行定位。 static默认值。没有定位，元素出现在正常的流中 sticky生成粘性定位的元素，容器的位置根据正常文档流计算...
position的值， relative和absolute分别是相对于谁进行定位，你真的知道吗？
热门推荐
yiyueqinghui的博客
09-19 1万+
常见的position定位方式如下: static 默认值。元素出现在正常的普通流中 relative 生成相对定位的元素，相对于其在普通流中的位置进行偏移。 fixed （老IE不支持）生成绝对定位的元素，通常相对于浏览器窗口或 iframe 进行定位。 inherit 继承父元素的position属性，但需要注意的是IE8以及往前的版本都不支持inherit属性。 absolute 生成绝对定位的元素， 相对于最近一级的 不是 static 的父元素来进行定位,如果没有找到的话，最
position:absolute相对于谁定位
aliven1的博客
04-30 7001
1.相对定位：相对于块级元素（或行内块）自身位置进行定位； 2.绝对定位：绝对定位的盒子是相对于离它最近的一个已定位的盒子进行定位的（默认是body）； 绝对定位元素相对的元素是它最近的一个祖先，该祖先满足：position的值必须是：relative、absolute、fixed，若没有这样的祖先则相对于body进行定位 ...
Position的值有哪些？relative和absolute分别是相对于谁进行定位的？
weixin_45574166的博客
12-09 1521
1.absolute 生成绝对定位的元素，相对于最近的一级的定位，不是static的父元素进行定位（是相对于离它最近的一个已定位的盒子进行定位的，默认是body。position必须是absolute或者relative的祖先元素） 2.fixed 生成绝对定位元素，通常相对于浏览器窗口或者frame进行定位。 3.relative 生成先对定位的元素，相对于普通流中的位置进行定位（相对于本元素原始位置进行定位）。 4.static 默认值，没有定位，元素出现在正常流中。 5.sticky 生成粘性
写出display的值，说明各自的作用？请写出position的值 relative和absolute分别是相对于谁进行定位的？
kobezzZ的博客
08-01 433
display 的值的作用： 1.block 块类型元素。 2.inline 行内元素类型。 3.inline-block 行内块元素类型。 4.list-item 象块类型元素一样，并添加样式列表标记。 position 的值的定位区别： 1.absolute 生成绝对定位的元素，相对于 static 定位以外的第一个祖先元素进行定位。 2.fixed 生成绝对定位的元素，相对于浏览器窗口进行定...
position:relative/absolute无法冲破的等级
10-31
CSS提供了多种定位方式，包括`static`、`relative`、`absolute`、`fixed`和`sticky`。本文将深入探讨`relative`与`absolute`定位方式在特定情况下的局限性及其解决方案。 #### 关键概念解释 - **position:relative*...
请谈谈css中使用position时，relative和absolute分别是相对于谁定位的
07-11
relative 和 absolute 是两种常用的定位方式，它们分别相对于不同的参考对象进行定位。 1. relative：相对定位（relative）是相对于元素自身原有的位置进行定位。当使用 relative 定位时，元素会根据自身在正常文档...
css中定位中的absolute和relative是什么意思
09-25
`position`有四个可能的值：`static`、`fixed`、`absolute`和`relative`，其中`absolute`和`relative`是最常用的两种。 1. `relative`（相对定位）： - 当`position`设置为`relative`时，元素仍然遵循正常的文档流...
列出display的值，说明他们的作用。position的值， relative和absolute分别是相对于谁进行定位的？...
09-11 329
diaplay取值有： block :设置元素以块样式显示 inline：设置元素以行内形式显示 inline-block：向行内元素一样显示，但内容向块级元素一样 none：隐藏元素，在页面中不占据空间 list-item：向块级一样显示，但添加列表样式 position的...
position的值，relative和absolute分别相对谁定位
qq_43378240的博客
11-28 583
absolute：生成绝对定位的元素，定位原点是离自己这一级元素最近的一级position设置为absolute或者relative的父元素的左上角为原点的，若没有此类父元素就往上找直到body。 relative：生成相对定位的元素，定位原点是元素本身所在位置。 fixed （老IE不支持）：生成固定定位的元素，相对于浏览器窗口进行定位。 static：默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right z-index 声明）。 inherit：规定从父元素继承
绝对定位，相对定位
ppznhy的博客
02-21 2079
绝对定位position:absolute 是相对于最近父元素进行定位的，如果最近父元素没有定位，他就会相对于根元素进行定位。而且不再占有原来位置。 相对定位position:relative 是相对自己原来位置定位，继续占有原来位置。 ...
相对定位position:relative;
fuxiaomi2016的博客
10-14 377
相对定位position:relative;
前端position: absolute是相对于谁定位的?
qq_42750608的博客
10-06 334
前端position: absolute是相对于谁定位的?答: 有position: absolute定位的元素都是找最近的父辈元素(有position:xxx定位的)进行相对偏移的
relative相对于谁定位_CSS3中absolute、relative、fixed定位详解
weixin_36222664的博客
01-24 508
点击“前端全栈之家”关注我们01定位显示在CSS中可以通过postion属性定义元素定位显示，语法如下：postion: static|relative|absolute|fixed1. static: 表示不定位，元素遵循HTML默认的流动模型，如果未显式声明元素的定位类型，则默认为该值。2. absolute: 表示绝对定位，将元素从文档流中拖出来，然后使用left、right、t...
position:absolute相对哪个元素定位
lzf的博客
06-01 7378
应用了position: absolute的元素会循着节点树中的父（祖）元素来确定“根”，然后相对这个“根”元素来偏移。如果在其节点树中所有父（祖）元素都没有设置position属性值为relative或者absolute则该元素最终将对body进行位置偏移。应用了position: absolute的元素会脱离页面中的普通流并改变Display属性（重点）！
position 的值， relative 和 absolute 分别是相对于谁进行定位的？
最新发布
zzx262625的博客
03-09 575
absolute : 生成绝对定位的元素， 相对于最近一级的 定位不是 static 的父元素来进行定位。 fixed （老 IE 不支持）生成绝对定位的元素，通常相对于浏览器窗口或 frame 进行定位。 relative 生成相对定位的元素，相对于其在普通流中的位置进行定位。 static 默认值。没有定位，元素出现在正常的流中 sticky 生成粘性定位的元素，容器的位置根据正常文档流计算得出
浅谈绝对定位:absolute与相对定位:relative
yy_9_aa的博客
09-23 3893
绝对定位（absolute）: 1. 以浏览器左上角的为参考点设置位置。 2. 与浮动一样不占据空间位置。 3. 嵌套的盒子，父元素无定位，子元素绝对定位，子元素仍然参照浏览器。 4. 父元素绝对定位，子元素绝对定位，子元素以父元素为参考点。 5. 给行内元素绝对定位之后就转化为行内快了。 6. 可以设置z-index[调整元素的层叠顺序]值的范围是:0-999，值大的在上方
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值