تنظیم اندازه ی فونت با Em

بازدید: 2226 بازدید

تنظیم اندازه ی فونت با Em

برای اجازه دادن به کاربرها جهت اندازه بندی مجدد متن (قابل دسترسی از طریق فهرست گزینش مرورگر مربوطه)، بسیاری از طراحان وب به جای استفاده از پیکسل، واحد em را بکار می برند .

W3C بهره گیری از واحد اندازه بندی فوق را به طراحان وب توصیه می کند .

۱em در واقع معادل با اندازه ی فعلی فونت می باشد . اندازه ی پیش فرض نوشته در مرورگرهای کنونی برابر است با ۱۶px . بنابراین، اندازه ی پیش فرض ۱em به عبارتی همان ۱۶px است .

با بهره گیری از فرمول ذیل می توان واحد پیکسل را به em محاسبه و تبدیل کرد

مثال

h1 {
font-size: 2.5em; /* 40px/16=2.5em */
}
h2 {
font-size: 1.875em; /* 30px/16=1.875em */
}
p {
font-size: 0.875em; /* 14px/16=0.875em */
}

 

در مثالی که در باال مشاهده می کنید، اندازه ی نوشته بر حسب em در حقیقت برابر است با مثال پیشین که بر حسب پیکسل اندازه بندی شده بود . با این وجود، با استفاده از اندازه ی em ،قابلیت تنظیم اندازه ی نوشته در تمامی مرورگرها وجود دارد .

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

 

در ادامه با آموزش های بعدی ما همراه باشید…