css层定位是什么 |css class 叠加

CSS层定位有三种方式：静态定位、相对定位、绝对定位

.static {
position: static;
}
.relative {
position: relative;
left: 50px;
top: 50px;
}
.absolute {
position: absolute;
left: 50px;
top: 50px;
}

静态定位是网页上默认的定位方式，也就是元素一开始的位置。元素只能在文档流上面的位置自由移动，但是不能调整它之后自己和后面元素的位置。

相对定位是基于初始位置移动的。通过left和top可以控制盒子在初始位置的偏移量。相对定位不脱离文档流，所以后面的元素会按照原来的位置排列。

绝对定位会脱离文档流，而是只根据浏览器窗口或是离它最近的具有已定位的祖先元素来计算偏移量。使用top、left、bottom、right来控制元素的位置。如果没有定位的祖先元素，那么元素的位置是以文档流为基准的。

CSS层定位可以为网页增添动态感，同时也能够使得网页的排版更加灵活，当网页有多个盒子时，使用CSS层定位可以很好地控制它们的位置和层级，从而实现更好的视觉效果。