شرح صفوف ومحتوى الفقرة
كل قياس رقمي في لغة CSS — سواء لضبط حجم الخط بـ font-size أو لضبط عرض العنصر width وارتفاعه height — يتكون من رقم متبوع بوحدة قياس ملتصقة به مباشرةً من دون أي مسافة فاصلة مثل 24px أو 50% (ولا يجوز حذف الوحدة إلا مع الرقم 0). ويحدد نوع الوحدة ما إذا كان تصميمك جامداً أم مرناً يتكيف بسلاسة مع الهواتف والشاشات العريضة:
- الوحدات المطلقة (
pxوcmوmmوinوpt): قياسات ثابتة لا تتغير بتغير أبعاد العنصر الأب أو إعدادات تكبير الخط الافتراضي في متصفح الزائر. - الوحدات النسبية (
remوemوchو%وvwوvhوsvhوdvh): قياسات ذكية تُحسب ديناميكياً نسبةً إلى مرجع آخر كحجم خط الجذر<html>أو أبعاد الحاوية الأم أو نافذة العرض.
ولكي ترى أثر العرض والارتفاع بوضوح بصري في أمثلة هذا الدرس، سنميز صناديق التجريب بلون خلفية مسمى عبر خاصية background-color.