نحوه استفاده از EMS برای تغییر اندازه قلم وب سایت (HTML)

با استفاده از Ems برای تغییر اندازه فونت ها

هنگامی که شما در حال ساخت یک صفحه وب هستید، اکثر متخصصان توصیه می کنند که اندازه فونت (و در واقع همه چیز) با اندازه نسبی مانند ems، exs، درصد یا پیکسل ها باشد. این به این دلیل است که شما واقعا نمی دانید همه روش های مختلفی که ممکن است فردی محتوای شما را مشاهده کند. و اگر از ابعاد مطلق (inches، centimeters، millimeters، points، picas) استفاده کنید، ممکن است روی نمایش یا خوانایی صفحه در دستگاه های مختلف تاثیر بگذارد.

و W3C توصیه می کند که از اندازه ems استفاده کنید.

اما چقدر بزرگ است؟

با توجه به W3C ام:

"برابر با مقدار محاسبه شده از مقدار font-size عنصر است که از آن استفاده می شود. استثنا زمانی است که em در مقدار اموال" اندازه فونت "رخ می دهد، در این صورت آن را اشاره می کند به اندازه فونت عنصر والدین. "

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

اما اندازه پیش فرض چقدر است؟ هیچ راهی برای اطمینان 100٪ وجود ندارد، زیرا مشتریان می توانند اندازه فونت پیش فرض خود را در مرورگرهای خود تغییر دهند، اما از آنجا که اکثر مردم نمی توانند فرض بکنند که اکثر مرورگر ها دارای فونت پیش فرض 16 پیکسل هستند. بنابراین بیشتر وقت ها 1m = 16px .

فکر کنید در پیکسل ها، از Ems برای اندازه گیری استفاده کنید

پس از شناختن این که اندازه فونت پیش فرض 16 پیکسل است، پس از آن می توانید از ems استفاده کنید تا اجازه دهید مشتریان شما به راحتی صفحه را تغییر اندازه دهند اما در اندازه های فونت به اندازه پیکسل فکر کنند.

بگو بفرمایید یک ساختار بزرگ مانند این است:

شما می توانید آنها را با استفاده از پیکسل ها برای اندازه گیری تعریف کنید، اما پس از آن هر کسی که با استفاده از IE 6 و 7 قادر به تغییر اندازه صفحه خود نخواهد بود. بنابراین شما باید اعداد را به ems تبدیل کنید و این فقط یک موضوع ریاضی است:

فراموش نکردن وراث

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

به عنوان مثال، شما ممکن است یک صفحه سبک مانند این داشته باشید:

p {font-size: 0.875em؛ }
.footnote {font-size: 0.625em؛ }

این باعث می شود که فونت های 14px و 10px به ترتیب برای متن اصلی و پاورقی ها باشند. اما اگر یک پاورقی را درون یک پاراگراف قرار دهید، می توانید متن را با اندازه 8.75 پیکسلی به جای 10 پیکسل به پایان برسانید. خودتان را امتحان کنید، این CSS بالا و HTML زیر را در یک سند قرار دهید:

این فونت 14px یا 0.875 متر در ارتفاع است.
این پاراگراف دارای یک پاور پوینت است.
در حالی که این فقط یک بند بند است.

متن پاورقی در 10 پیکسل سخت است و تقریبا نامرغوب در 8.75 پیکسل است.

بنابراین، هنگامی که از ems استفاده می کنید، باید از ابعاد اشیاء پدر و مادر بسیار آگاه باشید، یا شما می توانید با برخی از عناصر واقعا عجیب و غریب در صفحه خود به پایان برسید.