آموزشگاه فطرس

واحدهای اندازه در المنتور 1

دسته بندی : آموزش المنتور

واحدهای اندازه در المنتور 1

آموزش ویدئویی

آموزش متنی

در المنتور واحدهای اندازه گیری مختلفی وجود داره و در این جلسه بصورت کامل قصد داریم انواع واحد های اندازه گیری در المنتور رو بررسی کنیم.
انواع واحد های اندازه گیری :

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

  % , PX , EM , REM , VW , VH

PX :

پیکسل یکی از پر کاربردترین واحدهای اندازه گیری در المنتور است.
این نوع واحدهای اندازه گیری ثابت یا مطلق هستند.
زمانی که شما می خواهید اندازه ی عنصر شما ثابت باقی بماند و تحت هیچ شرایطی تغییر نکند از این واحد اندازه گیری استفاده کنید.
البته در المنتور با توجه به داشتن حالت واکنشگرا ، شما میتونید برای هر کدام از حالت های موجود مثل حالت موبایل ، تبلت و دسکتاپ یک اندازه ی متفاوت برحسب پیکسل برای عناصر خودتون انتخاب کنید.
در صورتی که شما هیچ عددی را برای فونت سایز وارد نکنید ، یک سایز پیش فرض برای عنصر شما در نظر گرفته میشه.

EM :
این واحد اندازه گیری و سایر واحدهای اندازه گیری به جز PX
همگی واحدهای اندازه گیری نسبی هستند.
یعنی چه ؟
یعنی اندازه ی آنها وابسته به یک عنصر دیگر است.
اندازه ی هر EM
برابر است با اندازه ی عنصر والدش.
مثلا اگر عنصر والد فونت سایزش 16 پیکسل باشد ، هر یک واحد EM
16 پیکسل خواهد بود.
مثال :
 2EM = 32PX
چون هر واحد آن گفتیم 16 پیکسل است پس 2 تا EM میشه 32px
حالا چطور ما باید در المنتور اندازه ی پیش فرض فونت سایز خودمون رو تغییر بدیم ؟؟
از طریق قسمت تنظیمات عمومی و بعد استایل قالب و بعد تایپوگرافی میتونیم اندازه ی پیش فرض فونت سایز رو تغییر بدیم.
مثلا اگر فونت سایز رو در اینجا بذاریم 18 پیکسل.
 2EM = 36PX

REM :
این واحد اندازه گیری بصورت نسبی است.
این واحد اندازه گیری کمی شبیه به واحد اندازه گیری EM است اما این دو متفاوت از هم هستند.
در EM اندازه ی ما برحسب عنصر والد تعیین می شد.
در REM اندازه برحسب عنصر ریشه تعیین میشه.
عنصر ریشه یعنی چه ؟
عنصر ریشه ی ما تگ html هستش و هر سایز فونتی که این تگ داشته باشه ، واحد اندازه گیری ما هم همون اندازه رو به خودش می گیره.
حالا چطور میتونیم اندازه ی فونت سایز عنصر ریشه رو تغییر بدیم ؟
در ویرایشگر المنتور میریم به قسمت پیشرفته و بعد css سفارشی.
در اینجا برای تغییر فونت سایز عنصر ریشه کد زیر رو قرار میدیم :
}html
;font-size: 20px
}
در اینجا به جای عدد 20 هر عدد دلخواهی رو میتونید وارد کنید ، تا به عنوان سایز عنصر ریشه ی شما در نظر گرفته بشه.
یک مثال از REM
 2REM = 40px
چون ما الآن سایز عنصر ریشه رو گذاشتیم 20 پیکسل و اینجا 2REM رو داشتیم اندازه ی ما میشه 40 پیکسل.
vw :
این واحد اندازه گیری هم کاملا نسبی هستش.
در اینجا عنصر به نسبت عرض قابل مشاهده اندازه اش تغییر میکنه.
مثلا یک فونت سایز ما برای نوشته ی خودمون انتخاب می کنیم.
سایز این نوشته با توجه به عددی که ما وارد می کنیم با توجه به عرض دستگاه ها در دستگاه های مختلف خود به خود تغییر می کند.
VH :
این واحد اندازه گیری دقیقا مشابه واحد اندازه گیری VW هستش.
با این تفاوت که براساس ارتفاع قابل مشاهده در دستگاه های مختلف عنصر ما تغییر پیدا میکنه.
دوستان عزیزم خسته نباشید ، مواردی که گفته شد رو سعی کنید باهاشون کار کنید ، تغییرات رو ایجاد کنید تا انشالله تمام موارد ملکه ی ذهنتون بشه.
در جلسه ی آینده میریم سراغ یک واحد اندازه گیری مهم یعنی درصد.

نویسنده

نویسنده

میلاد پورزارعی دانش آموخته ی ممتاز رشته ی مهندسی نرم افزار ، طراح سایت ، متخصص سئو ، استراتژیست بازاریابی و فروش

دیدگاهتان را بنویسید

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