CSS相對(duì)定位是指元素相對(duì)于其原本的默認(rèn)位置進(jìn)行偏移的一種方式。在相對(duì)定位中我們可以使用“top, bottom, left, right”四個(gè)屬性來進(jìn)行元素的定位。
下面我們來看一段代碼：
div {
position: relative;
top: 50px;
left: 20px;
background-color: #fa8072;
width: 200px;
height: 100px;
}在上面的代碼中，我們?cè)O(shè)置了
元素的相對(duì)定位，用“top:50px”和“l(fā)eft:20px”的屬性來對(duì)元素進(jìn)行偏移。也就是說，這個(gè)元素會(huì)相對(duì)于它的原始位置向下移動(dòng)50像素，向左移動(dòng)20像素。
需要注意的是，在相對(duì)定位中，我們所偏移的元素依然存在于文檔流中，也就是說，元素占用的空間并沒有發(fā)生改變。即使我們?cè)O(shè)置元素的位置進(jìn)行偏移，它所在的文檔流的位置并不會(huì)發(fā)生改變。
最后，通過使用 CSS 相對(duì)定位，我們可以通過簡(jiǎn)單的屬性設(shè)置，輕松地對(duì)元素位置進(jìn)行調(diào)整，方便實(shí)現(xiàn)一些特定的布局效果。