position ="absolute" 与 position="fixed的异同"

最新推荐文章于 2023-06-04 22:58:10 发布
最新推荐文章于 2023-06-04 22:58:10 发布
阅读量1.5k 收藏
点赞数
分类专栏： css 文章标签： css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u012079603/article/details/43020289
版权
position ="absolute" position="fixed" 
相同点
第一，完全脱离标准文档流
第二，未设置偏移量时，都定位在父元素左上角
不同点一：
 设置偏移量时，偏移量的基准
absolute 
1.无已定位的祖先元素，以<html>为基准
2.有已定位的祖先元素，以最近的父元素的为基准偏移
fixed
有无已定位的祖先元素都以浏览器的可视窗口为基准偏移


不同点二：
表现形式:(产生滚动条时)
absolute:位置会随滚动条变化
fixed:位置不会随滚动条变化
Bo年再无木小白
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
position:fixed;
m0_37972548的博客
12-26 4万+
为什么设置position：fixed；div会消失。 此文如有不正确的地方，敬请留言指出，谢谢。 1.position:fixed;作用 生成绝对定位的元素，相对于浏览器窗口进行定位。可以通过设置 "left", "top", "right" 以及 "bottom" 属性给目标元素定位。 例如：将id = content 的div固定在窗口底部，距离窗口左边距离200px。滚动条上下滚动
关于固定定位position:fixed最简单、最直白的应用
wangitso的博客
12-24 5247
关于固定定位position:fixed最简单、最直白的应用position:fixed是啥？有啥用 position:fixed是啥？有啥用 position:fixed是固定定位的意思，就是把一个DIV（footer）固定在页面的最底部，无论页面上面的内容如何滚动，页面下部的（footer）不动。 要实现这个功能的时候百度了好多，但是也没看明白，把教程的代码拿过来仔细研究尝试才知道了，原来是这...
position:fixed 固定定位
热门推荐
asdfgv2022的博客
08-03 5万+
元素的位置相对于浏览器窗口是固定位置。即使窗口是滚动的它也不会移动：特性特性：1.元素脱离正常文档流，不占位(也脱离文本流，全脱)2.始终相对于浏览器窗口四个角为原点进行固定定位的3.不会随页面的内容滚动而滚动4.能使不能设置宽高的行级元素设置宽高5.提升层级6.如果没有定位偏移属性，对元素本身有影响；应用场景：相对于窗口定位的元素如弹窗、跟随滚动的导航、侧边栏...
CSS属性详解——position:fixed
最新发布
Wod_7的博客
06-04 7596
CSS中的固定定位fixed定位是一种定位方式，使元素相对于浏览器窗口固定位置，换句话说，固定定位的元素会脱离文档流，始终停留在浏览器窗口的某个位置不动，即使用户上下滚动页面也不会改变其位置。
position：fixed固定定位的用法
demin3278的博客
01-03 6325
一、position：fixed；固定定位 　　1.实现某个元素在可视窗口的居中位置显示 　　　　1）给自身设置宽高； 　　　　2）给自身加position：fixed； 　　　　3）用margin向左移动自身宽度的一半，向上移动自身高度的一半； 　　或： 　　　　1）给自身设置宽高； 　　　　2）再设置position：fixed； 　　　　3）再给自身设置left：0...
No.11 position定位 之 fixed固定定位
lzh131464的博客
12-30 4585
在css中，使用position（定位），它允许你定义元素框相对于其正常位置应该出现的位置，或者相对于父元素、另一个元素、甚至是浏览器窗口本身的位置。 本篇介绍： fixed（固定定位） fixed定位元素相对于浏览器窗口进行偏移，即定位基点是浏览器窗口。不管窗口如何滚动，它的位置始终不变。 fixed搭配定位偏移量top、bottom、left、right一起使用，改变固定定位元素的初始位置，否则初始位置就是该元素在文档中的默认位置。 格式语法： css选择器 {position：fixed;
position:fixed或absolute时百分比参考屏幕宽度
09-25
用百分比设定元素的宽度，一般情况是指参考父元素的宽度，当position是fixed或absolute时，百分比是参考屏幕的宽度
li标签的position:absolute与relative案例应用
12-13
今天在写一个购物车里面选择发货地址的部分时，多个收货地址用到了UL标签，由于每个地址的后面有个“修改地址”的功能，而且位于li标签的右边，于是就用到了，position：absolute； right：10px；这样把“修改地址”...
css position: absolute、relative详解
10-30
今天在看CSS的时候遇到了position: absolute、relative的问题，一直比较迷糊，今天终于搞清楚了。
CSS position:absolute全面了解
09-24
下面小编就为大家带来一篇CSS position:absolute全面了解。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
static(静态定位)，fixed（固定定位），relative(相对定位)，absolute(绝对定位)
qq_44939011的博客
07-20 8488
static(静态定位)，fixed（固定定位），relative(相对定位)，absolute(绝对定位) Position的取值： static(静态定位) : 表示块保留在原本应该在的位置，不会重新定位。 fixed（固定定位）：元素就被固定不会随着滚动条的拖动而改变位置。 relative(相对定位) ：相对定位是通过将元素从原来的位置向上、向下、向左或者向右移动来定位的。 absolute(绝对定位)：绝对定位，是相对于最近的且不是static定位的父元素来定位。 1.static(静
absolute和fixed的区别
guolulu66的博客
10-13 533
fixed:固定定位 absolute:绝对定位 区别很简单： 1、没有滚动条的情况下没有差异 2、在有滚动条的情况下，fixed定位不会随滚动条移动而移动，而absolute则会随滚动条移动 常用场合： 1.fixed固定定位，只针对浏览器窗口定位，上下左右，不会随着窗口大小改变，固定不变，例如固定位置的小广告，常用于网站边缘的公司联系方式和快速回到顶部 2.absolute绝对定位，脱离文档流，没有父元素，上下左右设置是针对于浏览器窗口，不占据位置，会随着窗口大小与页面一起改变 ...
html中fixed属性,CSSposition属性中：fixed使用详解
m0_70664757的博客
01-16 2884
是结合top、bottom、left和right这4个属性一起使用的，其中“position:fixed;”使得元素成为固定定位元素，接着使用top、bottom、left和right这4个属性来设置元素相对浏览器的位置。当元素的position属性设置为fixed时，这个元素就被固定了，被固定的元素不会随着滚动条的拖动而改变位置。在视野中，固定定位的元素的位置是不会改变的。fixed固定定位和absolute绝对定位比较类似，它们都能够让元素产生位移，并且脱离文档流。/*设置元素为固定定位*/
position:fixed实现相对于父级定位
callmeCassie的博客
10-26 1万+
position:fixed
CSS中定位属性absolute和fixed的区别和用法
sinat_36227086的博客
03-02 864
1.区别 （1）absolute 生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。 元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。 （2）fixed 生成绝对定位的元素，相对于浏览器窗口进行定位。 元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。 2.用法 如果需要元素相对右侧固定，但是能够随屏幕滚动，则用 absolute。注意父元素要为relative 如果元素不能随父
CSS定位布局详解
大河之犬的博客
10-03 4165
CSS定位使你可以将一个元素精确地放在页面上指定的地方。联合使用定位和浮动，能够创建多种高级而精确的布局。其中，定位布局共有4种方式。固定定位（fixed相对定位（relative绝对定位（absolute静态定位（static。
css中position:fixed的一些影响问题
weixin_44817180的博客
06-10 829
1.当页面底部有个固定button，且给其固定min-width，当屏幕宽度小于min-width时不会出现横向滚动 解决办法：就是给这个固定button外面加个div，其class为buttonBox,并且把原button的class（.fixedBtn）中的position：fixed删除。 2.当页面底部有个固定button，且给其固定min-width，当屏幕宽度小于min-width时不会出现横向滚动，这时如果在position：fixed层加display：flex;有可能会导致，固定的butt
CSS:position:fixed使用(转)
aj1971的博客
01-04 159
position属性规定元素的定位类型，即建立元素布局所用的定位机制。任何元素都可以定位，不过绝对定位或固定定位元素会生成一个块级框，而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。 position属性值除了默认的static外，还有relative、absolute、fixed，本文重点讨论fixed属性值。 一、posit...
position=fixed什么意思
03-26
position:fixed 是 CSS 中的一种定位方式，用于将元素固定到浏览器窗口的位置，无论用户滚动页面或者拖动滚动条，该元素都会一直保持固定的位置不变。可以用于菜单栏、滚动条等需要固定在页面上的元素。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值