قالب وردپرس پوسته وردپرس قالب فروشگاهی وردپس
خانه / آموزش css / پازیشن های مختلف

پازیشن های مختلف

پس از اینکه طی چندین مقاله با  برخی دستورات CSS آشنا دشمی اکنون نوبت به معرفی مفهوم position ها در CSS میرسد.می خواهیم انواع position ها در CSS را بررسی کرده و تفاوت انها را مورد بررسی قرار دهیم.این مقاله ششمین مقاله از سری آموزش CSS می باشد که به صورت کامل آموزش CSS حرفه ای را فرا می گیرید.

position ها و تفاوت آنها در CSS

در CSS یکی از مهمترین و کاربردی ترین مباحث ، مبحث position هاست.در CSS موقعیت ها یا پوزیشن های اصلی عبارت است از:

  • static
  • relative
  • fixed
  • absolute

انوااع position در css

نوع اول یعنی استاتیک  (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 ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

درباره ی admin

مطلب پیشنهادی

نکات مهم css

در ادامه مقالات آموزش CSS : شاید تا کنون دو مفهوم inline-block و float را …

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

قالب وردپرس پوسته وردپرس قالب فروشگاهی وردپس