ویژگیهای Position در CSS
ویژگی position در CSS تعیین میکند که یک المان در کجای صفحه قرار بگیرد. شما از top ،right ،bottom و left برای جابهجا کردن آنها استفاده میکنید.
پنج نوع اصلی برای موقعیتدهی وجود دارد.
Static
این حالت پیشفرض است. المانها از ترتیب عادی صفحه پیروی میکنند. در این حالت، استفاده از ویژگیهای top یا left هیچ تأثیری ندارد.
Relative
این حالت، المان را بر اساس جایگاه اصلیاش جابهجا میکند. اگر ۲۰ پیکسل به top اضافه کنید، المان به سمت پایین حرکت میکند. سایر المانها در جای اصلی خود باقی میمانند و فضای خالی ایجاد شده را پر نمیکنند.
Absolute این حالت، المان را از جریان عادی صفحه خارج میکند. المان موقعیت خود را بر اساس نزدیکترین جد (ancestor) که دارای موقعیت (positioned) باشد، تعیین میکند.
انواع دیگر شامل Fixed و Sticky هستند. المانهای Fixed حتی هنگام اسکرول کردن، در یک نقطه ثابت میمانند. المانهای Sticky مانند المانهای relative عمل میکنند تا زمانی که به نقطه مشخصی برسند، سپس ثابت میمانند.
درباره این ویژگیها بیشتر اینجا بخوانید.
منبع: https://dev.to/kavin_loyola_660466e5ea96/css-position-properties-23o8