در این پست بسیار کوتاه میخوام توضیحی درمورد چهار پوزیشن مهم و پراستفاده درcss بدم.
static , relative , fixed , absolute
1.static
پوزیشن دیفالت برای هر المنت static است .
هر المنت با پوزیشن static در جایی که انتظارش داریم قرار میگیرد یعنی جایی که برای آن در HTML مشخص کرده ایم و مکان اولیه آن عوض نمیشود یعنی صفات left ,top ,bottom و right تاثیری روی المنت مورد نظر ندارد.
2.relative
یک المنت با پوزیشن relative میتواند نسبت به مکان اولیه اش جا به جا شود . صفات top ,left و ... میتوانند المنت را نسبت به مکان اولیه اش جا به جا کنند ولی مکان اولیه آن توسط المنت های دیگر پر نخواهد شد ،یعنی باوجود تغییر مکان هنوز هم مکان اولیه اش اشغال شده حساب میشود.
3.fixed
یک المنت با پوزیشن fixed نسبت به صفحه نمایش جابه جا میشود . صفات left ,right و ... آن را در صفحه جابهجا میکند ولی برخلاف relative مکان اولیه اش اشغال نمشود و میتواند با المنت های دیگر پر شود.
4.absolute
یک المنت با پوزیشن absolute نسبت به نزدیکترین المنت پدر خود جابهجا میشود و اگر المنت پدر نداشت نسبت به body جابهجا میشود .
**نکته : اگر میخواهید متنی را در تصویری قرار دهید به تصویر مورد نظر پوزیشن relative و به متن خود پوزیشن absolute بدهید.
همچنین این لینک میتونه در یادگیری چگونگی استفاده از پوزیشن مناسب باشه.
اگر این مقاله برای شما مفید بود در انتشار آن کوتاهی نکنید.
شیواتوکل | 14اسفند 98