واحدهای مطلق

ویژگی های سی اس اس فقط می توانند مقادیر خاص مربوط به خود را قبول کنند. مقادیری مثل کلمات کلیدی, آدرس, رنگ و یا یک عدد.

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

خیلی از ویژگی های سی اس اس مقادیر طولی می پذیرند, مثل font-size, margin و یا line-height. که این مقادیر طولی می توانند با واحدهای متفاوتی معرفی شوند.

در سی اس اس چندین واحد برای بیان اندازه های طولی وجود دارد که برخی از آنها پیشینه ای در دنیای تایپوگرافی دارند: مثل واحد نقطه(pt), برخی برگفته از واحدهایی هستند که همه روزه در محیط اطرافمان می شنویم و استفاده می کنیم: مثل سانتی متر(cm), میلی متر(mm). و همچنین واحدهایی که بیشتر برای دنیای کامپیوتر به ویژه سی اس اس به دنیا آمدند مثل پیکسل (px).

در دنیای سی اس اس دو خانواده برای واحدهای طولی وجود دارند, واحدهای مطلق و واحدهای نسبی که در این مطلب با واحدهای مطلق آشنا می شویم.

 

واحدهای مطلق

واحدهای مطلق شامل واحدهای فیزیکی (in, cm, mm, pt, pc) و px می باشند.

  • واحدهای فیزیکی
  • px

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

رابطه بین آنها به قرار زیر است:

 


1in = 2.54cm = 25.4mm = 72pt = 6pc

 

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

الف: سنجش فیزیکی زمانی اتفاق می افتد که محیط نمایشی ما پرینترها و صفحه نمایش هایی با رزولوشن بالا (high-dpi) باشند. که در این حالت یک اندازه طولی در هریک از واحدهای pc, pt, mm, cm و in به همان اندازه ای که در دنیای فیزیکی شناخته شده است ظاهر می شود ( یعنی یک سانتی متر همون یک سانتی متری هستش که خیاط محله ما باهاش کت و شلوار می دوزه کسی هم نمیخره :) ).

در این محیط ها واحد پیکسل با توجه به واحدهای فیزیکی تعیین می شود (1px = 1/96in).

ب: و اما در محیطهایی با رزولوشن پایین (low-dpi) یک واحد پیکسل نمایانگر پیکسل مرجع است و همه واحدهای فیزیکی با توجه به پیکسل مشخص می شوند. 1in برابر با 96px خواهد بود و دیگر واحدهای فیزیکی مثل cm و غیره شاید دیگر آن مقداری که در دنیای واقعی هستند, نباشند. یعنی 1 سانتی متر روی یک دستگاه با رزولوشن پایین برابر با 1 سانتی متر بر روی کاغذ نیست.

 

px

درست است که px یک واحد مطلق است اما یک واحد ثابت نیست. این واحد وابسته به دستگاه (پرینتر, صفحه نمایش) تعیین می شود. چراکه هر دستگاه می تواند یک پیکسل را هر اندازه ای که بخواهد تعیین کند تا 1px به مقدار صحیحی که آن دستگاه نیاز دارد برسد.

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

در دستگاه هایی با رزولوشن بالا و پرینترها, 1px برابر با چندین پیکسل دستگاه می باشد. تعداد پیسکل های دستگاه برای 1px در CSS طوری تعیین می شوند تا رابطه بین px و in ثابت باقی بماند. (1px = 1/96in)

پیکسل در css
مقایسه 1px در مانیتور و پرینتر

 

mm

این واحد همان میلیمتر معروف است :)

 

cm

رابطه سانتی متر با دو واحد mm و px بصورت زیر است:

 


1cm = 10mm = 37.8px

 

 

in

رابطه یک اینچ با دو واحد cm و px بصورت زیر است:

 


1in = 2.54cm = 96px

 

 

pt

یک واحد point یا نقطه برابر است 1/72 یک اینچ.

 


1pt = 1/72in

 

خارج از دنیای سی اس اس نقطه رایج ترین واحد برای تعیین اندازه فونت سایز می باشد. به همین دلیل است که بهتر است زمانی که برای پرینترها در سی اس اس استایل می نویسیم از pt استفاده کنیم.

 

pc

هر pc برابر با 12 نقطه است.

 


1pc = 12pt

 

در دموی زیر با تغییر مقادیر واحدهای مختلف با این واحدها بیشتر آشنا شوید:

 

See the Pen Absolute Length Units by Mojtaba Seyedi (@seyedi) on CodePen.