CSS Байршил

position шинж чанар нь элементийн веб хуудас дээрх байршлыг нарийн тодорхойлно.

static — анхдагч төлөв, хуудасны ердийн урсгалаар байрлана (top, left ажиллахгүй).
relative — анхны байсан байрлалаасаа харьцангуй шилжинэ.
absolute — хамгийн ойрын position: relative бүхий эцэг элементтэйгээ харьцуулан байрлана.
fixed — дэлгэцийн цонхонд (viewport) бэхлэгдэнэ, скролдоход байрлал нь өөрчлөгдөхгүй.
sticky — скролдож тодорхой зайд хүрэхэд fixed мэт бэхлэгдэнэ.

Жишээ

<!DOCTYPE html>
<html>
<head>
<style>
.parent { position: relative; width: 300px; height: 150px; background: #e2e8f0; }
.child { position: absolute; top: 10px; right: 10px; background: #2563eb; color: white; padding: 5px 10px; }
</style>
</head>
<body>
<div class="parent">
    Эцэг элемент (relative)
    <div class="child">Хүү (absolute)</div>
</div>
</body>
</html>

Туршиж үзэх »