css定位有哪几种方式

     **CSS 定位 (Positioning) 属性允许你对元素进行定位。**
         它也可以将一个元素放在另一个元素后面，并指定一个元素的内容太大时，应该发生什么。

元素可以使用的顶部（top），底部( bottom)，左侧(left)和右侧(rigeht)属性定位。然而，这些属性无法工作，除非是先设定position属性。他们也有不同的工作方式，这取决于定位方法。

      **有四种不同的定位方法**

第一种
static（静态定位）：

默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right 或者 z-index 声明）。

第二种
relative： 相对定位
相对定位元素的定位是相对其正常位置
举例

h1.max-lest
{
position:relative;
left:-10px;
}
h2.max-right
{
position:relative;
left:-10px;
}

因此可以移动的相对定位元素的内容和相互重叠的元素,它原本所占的空间不会改变。

相对定位元素还经常用来作为绝对定位元素的容器块。

作用：
1 如果没有定位偏移量，对元素本身没有任何影响
2 不使元素脱离文档流，空间是会被保留。
3 不影响其他元素布局
left、top、right、bottom是相对于当前元素自身进行偏移的

第三种
absolute : 绝对定位 :
绝对定位使元素的位置与文档流无关，因此不占据空间。

     绝对定位的元素的位置相对于最近的已定位父元素，如果元素没有已定位的父元素，那么它的位置html举例

h2{
pasition:absolute:
left:100px;
top:100px;
}

作用：
1 使元素完全脱离文档流
2 使内联元素支持宽高 （让内联具备块特性）
3使块元素默认宽根据内容决定（让块具备内联的特性）
4 如果有定位祖先元素相对于定位祖先元素发生偏移，没有定位祖先元素相对于整个文档发生偏移（绝对、相对、固定）

第四种
fixed : 固定定位
元素的位置相对于浏览器窗口是固定位置。
即使窗口是滚动的它也不会移动：
举例

p.pos-fixed
{
position:fixed;
top:20px;
right:5px;
}

作用：
1 使元素完全脱离文档流
2使内联元素支持宽高 （让内联具备块特性）
3使块元素默认宽根据内容决定（让块具备内联的特性）
4相对于整个浏览器窗口进行偏移，不受浏览器滚动条的影响，
不会受到祖先元素的影响。
注意：
1 Fixed定位使元素的位置与文档流无关，因此不占据空间。
2 Fixed定位的元素和其他元素重叠。

补充
sticky : 黏性定位
position:sticky是css定位新增属性；可以说是static（没有定位） 和 固定定位fixed 的结合。

在没有到达指定位置的时候，是没有定位效果的，到达了指定位置，就变成了固定模式。

    定位偏移量 : left top right bottom , 不能单独使用，必须得配合定位模式。

使用条件
1父元素不能overflow:hidden或者overflow:auto属性。
2必须指定top、bottom、left、right4个值之一，否则只会处于相对定位
3父元素的高度不能低于sticky元素的高度
4sticky元素仅在其父元素内生效

结束啦,疫情还在继续，但是梦想同样不能停，祝看到我文章的每个人都身体健康，相信疫情一定会过去，最后赢家一定是我们，加油。

小白，望各位大神手下留情，也希望得到更多前辈的指数，希望更多刚开始学编程的小白都能坚持下去，成为自已想成的人，逆流而上，逆战加油。