پس از اینکه طی چندین مقاله با برخی دستورات CSS آشنا دشمی اکنون نوبت به معرفی مفهوم position ها در CSS میرسد.می خواهیم انواع position ها در CSS را بررسی کرده و تفاوت انها را مورد بررسی قرار دهیم.این مقاله ششمین مقاله از سری آموزش CSS می باشد که به صورت کامل آموزش CSS حرفه ای را فرا می گیرید.
position ها و تفاوت آنها در CSS
در CSS یکی از مهمترین و کاربردی ترین مباحث ، مبحث position هاست.در CSS موقعیت ها یا پوزیشن های اصلی عبارت است از:
staticrelativefixedabsolute
نوع اول یعنی استاتیک (static) ، بدین معناست که عنصر مورد نظر به صورت ایستا و به صورت پیش فرض موقعیت خود را تعیین می کند.مفهوم static را در مقایسه با سایر موارد بهتر خواهیم فهمید.ابتدا fixed را بررسی می کنیم.در CSS اگربخواهیم عنصری را در محلی ثابت نگه داریمکه حتی با تغییر اسکرول بار ،موقعیت ان جا به جا نشود از موقعبت مکانی fixed استفاده می کنیم.این موقعیت در CSS ،برای مواردی نظیر سیستم های چت استفاده می شود.یا در هر جایی که بخواهیم یک عنصر را در موقعیت خود ثابت نگه داریم.بنابراین توجه نمایید که هر عنصری که موقعیت ان fixed ّاشد موقعیت مکانی خود را نسبت به کل پنجره تنظیم می کند و حتی با تغییر اسکرول بازهم سرجای خود باقی می ماند.پس از ان نوبت به موقعیت مکانی absolute در CSS میرسد.این موقعیت در مواردی استفاده میشود که بخواهیم موقعیت یک عنصر را با CSS بدون وابستگی به عناصر کناری تعیین کنیم.یعنی هر عنصری که position آن از نوع absolute باشد هیچ تاثیری روی سایر عناصر و موقعیت انها ندارد و به عکس،هیچ تاثیری از عناصر همجوار نمی پذیرد.این نوع position در CSS کاربرد فراوانی دارد.نکته قابل توجه که در فیلم آموزش CSS به آن اشاره کردیم این سات که موقعیت absolute ،موقعیت مکانی خود را نسبت به اولین عنصر والدی که موقعیتی غیر از استاتیک داشته باشد تنظیم میکند.همچنین موقعیت های absolute,fixed,relative را می توان با استفاده از خصوصیات top , bottom ,left , right موقعیت انها را تنظیم کرد.و اما پوزیشن releative معروف به position نسبی می باشد.با این پوزیشن در آموزش تصویری CSS قبلا آشنا شده ایم.جهت تسلط بیشتر بر این موارد،به آموزش CSS مراجعه کنید.در صورت علاقه مندی به آموزش ASP.NET کلیک کنید.
سایت بزرگ کلیک سایت،بهترین مرجع در ضمینه آموزش طراحی سایت و آموزش html و آموزش css میباشد.تمامی فیلم های آموزشی این سایت توسط استادان کاردان و بسیار با تجربه تهیه شده که تضمینی بر کیفیت بالای تمامی آن ها است.قیمت محصولات نیز کاملا رقابتی بوده و با مقایسه آن با سایر سایت ها میتوان به خوبی متوجه این موضوع شد.
هیچ نظری موجود نیست:
ارسال یک نظر