< p >CSS中的相對定位非常常見，是一種定位方式，它相對于元素本身的默認位置進行定位，而不是相對于瀏覽器窗口或文檔的。< pre >.example { position: relative; top: 20px; left: 50px; }< /pre >< p >上面這段代碼就是一個相對定位實例，通過設(shè)置元素的position為relative，然后通過top和left屬性來控制元素相對于其默認位置的上下和左右移動。< p >相對定位的一個非常好用的特性是它不會影響其他元素的位置。當(dāng)元素使用相對定位進行定位時，它仍然占用原來在文檔流中的位置，其他元素不會受到影響。這使得相對定位成為一種非常有用的布局工具，可以用來微調(diào)頁面布局。< pre >.parent { position: relative; } .child { position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%); }< /pre >< p >上面這個例子中，通過設(shè)置父元素的position為relative，子元素可以相對于父元素進行定位。我們使用top和left屬性來將子元素移動到父元素的中心，然后通過transform: translate(-50%, -50%);來進行微調(diào)，確保子元素完全居中。< p >總體來說，相對定位是CSS布局中非常有用的一種方法，可以用來微調(diào)頁面布局，而不會對其他元素造成影響。熟練掌握相對定位的使用，可以讓我們更容易地創(chuàng)建出漂亮實用的網(wǎng)頁布局。