html中position属性值有哪些

哦，我对这个话题了解很多。
刚学CSS的时候，position属性一度让人头疼。
我已经踩过你提到的这些价值观的所有陷阱。

那一年，我正在建设一个电子商务网站，页面非常复杂。
起初，我认为这很容易并使用静态，但即使该元素应该位于位置 A，但它按照文档流动，并且后续元素很混乱。
例如，产品介绍框原本计划放在左侧，但现在与标题对齐。
这真的很烦人。

然后我切换到亲戚。
我记得当时有一个按钮，但我想使用 left: 1 0px; 将其向右移动一点；没问题，搬家了。
重要的是后面的小图标、小描述等位置没有改变，没有被遮挡。
这很好，不会影响其他元素。
我经常用这个，调整位置很容易。

当您稍后创建事件页面以创建弹出窗口时，您将需要使用绝对。
想一想。
此弹出窗口必须固定在特定产品图像旁边，并且不能移动或阻止该图像。
将图像的父级 div 设置为position:relative。
然后将弹出 div 设置为位置：Absolute。
然后指定顶部和左侧。
太完美了。
弹出窗口位于图像旁边，并且当您滚动页面时不会移动。
但要注意，如果嵌套层次太深或者父级没有设置位置，绝对定位将无法找到祖先，需要手动指定body或body。
当时我就因为这个改了好几次，很是困惑。

我经常使用固定的东西，例如导航栏和小型浮动按钮。
我记得去年当我为我的移动应用程序开发 H5 页面时，我需要将后退按钮固定在左上角以供用户单击。
我只是使用位置：固定；左：1 0px；顶部：1 0px；结尾。
当您滚动页面时，该按钮始终可见，这极大地提高了用户体验。

触摸不太粘的东西。
大约从前年开始，我就一直在创建一个文章详细信息页面。
将导航栏滚动到顶部可以修复它，在修复之前我希望它能够正常滚动。
我尝试过位置：粘性；顶部：0；并发现旧版本的Android手机反应非常迟钝。
后来查资料发现父元素不能有overflow:hidden;它还需要一个前缀，例如 -webkit-。
幸运的是，现在已经有了移动浏览器，所以这通常不是什么大问题。

总之，它很好地利用了position属性，并且在布局上有非常高的自由度。
然而，如果使用不当，头发实际上会脱落。
请花点时间考虑一下。

网页positionrelative 网页position是什么意思

是的，这就是问题所在。
在网页布局中，position属性很重要。

static是默认布局，不会移动。

相对，元素改变其位置但保持在同一位置。

完整，完全独立，不占据任何位置，依赖祖先的地位。

当然，当然，无论页面如何滚动，它都在那里。

简单来说，位置有三种，稳定、相对、绝对、固定。
正确使用它们，网页布局将会变得更加容易。
亲自看看哪一个最常用？

谁能帮我解释一下在html里position: relative;是什么意思？

哎呀，之前在做网站布局的时候，因为对定位理解不够，差点把页面搞乱了。
记得当时2 01 8 年我正在做一个电商网站，为了在页面顶部设置一个导航栏，我使用了position:relative;。
我想：这东西不是相对于父元素定位的吗？那么，如果我把导航栏放在正文的顶部不好吗？结果一刷新页面，导航栏就飘到了屏幕中间，很烦人。

后来我仔细研究了position:relative;之间的区别。
和位置：绝对；。
相对定位实际上是基于元素本身的正常位置。
例如，如果您设置 left:2 0px;对于 div 元素，它将从正常位置向左移动 2 0 像素。
当时不太明白这个原理，以为这个参数 left:2 0px;将直接从父元素的左侧计算。

我们来谈谈绝对定位。
这东西很神奇，它是相对于最近定位的祖先元素定位的。
例如，如果您定义position:absolute;到一个div，然后你设置position:relative;到其父元素，则 div 将相对于其父元素定位。
我在一个页面上，使用绝对定位在页面最右侧放置了一个广告栏，然后使用top和left属性调整其位置，这样无论页面向哪个方向滚动，广告栏始终保持在屏幕最右侧。

所以定位其实很简单，理解了就很简单，但是理解错了就很头疼了。
记得有一次做项目的时候，因为对绝对定位理解不够，所以屏幕左上角总是显示一个弹出层。
无论我如何调整顶部和左侧的值，它都不起作用。
最后不得不重新检查整个页面的布局结构，发现是因为忘记设置position:relative;到父元素。

总之，定位是个好东西，但你也需要了解它的原理和用途，否则你很容易上当。
我个人在这方面经历过很多坑，现在说起来还是有些感慨。
嘿，别说了，我需要快速修复这个电子商务网站上的导航栏。