如何学会HTML标签定位？_随笔

1、绝对定位

绝对定位指的是通过规定HTML元素在水平和垂直方向上的位置来固定元素，基于绝对定位的元素不会占据空间。

绝对定位的位置声明是相对于已定位的并且包含关系最近的祖先元素。如果当前需要被定位的元素没有已定位的祖先元素作为参考值，则相对于整个网页。

2、相对定位

position：relative；

相对定位与绝对定位的区别在于它的参照点不是左上角的原点，而是该元素本身原先的起点位置。并且即使该元素偏移到了新的位置，也仍然从原始的起点处占据空间。

3、固定定位

position：fixed；

固定定位永远都会相对于浏览器窗口进行定位，固定定位会固定在浏览器的某个位置，不会随滚动条滚动。最常用的就是电脑里面是不是d出的小广告，如果你不差掉它，当时滑动鼠标查看网页时，小广告一直会在那里，还有常用的就是网站或者APP的导航栏和底部的选择栏。

原文地址：https://www.cnblogs.com/czy18227988114/p/11568586.html

作者：cz11

需要准备的材料分别有：电脑、浏览器、html编辑器。

1、首先，打开html编辑器，新建html文件，例如：index.html。

2、在index.html中的<body>标签中，输入html代码：<button style="position: absoluteleft: 250pxtop: 40px">按钮</button>。

3、浏览器运行index.html页面，此时按钮被固定在距离上方40px，左侧250px的位置。

欢迎分享，转载请注明来源：内存溢出

如何学会HTML标签定位？