شرح صفوف ومحتوى الفقرة
اعتمد جدول المراجعة القياسي التالي في كل صفحة ويب تبنيها قبل الانتقال إلى كتابة استعلامات الوسائط الشرطية:
| الإعداد أو الوحدة | القاعدة القياسية المعتمدة | الأثر الهندسي والعملي |
|---|---|---|
width=device-width | إلزامي في وسم viewport | يطابق عرض التخطيط مع العرض المنطقي الحقيقي للجهاز |
initial-scale=1.0 | يقترن دائماً بعرض الجهاز | يفتح الصفحة بحجم طبيعي واضح دون تصغير وهمي |
user-scalable=no | ممنوع تماماً في الإنتاج | يمنع ضعاف البصر من التكبير ويخالف معايير الوصول |
width: 100% بدل 100vw | الخيار الآمن للحاويات الكاملة | يمنع ظهور شريط تمرير أفقي بسبب عرض شريط التمرير الرأسي |
min-height: 100dvh | أفضل من height: 100vh الجامدة | يتكيف بسلاسة مع انزلاق شريط عنوان متصفح الهاتف |
خلاصة المعرفة ومحطة الانتقال
ملخص الدرس
حصاد الدرسمراجعة مركّزة لأهم المفاهيم والقواعد الهندسية التي أتقنتها في هذا الدرس قبل التطبيق العملي
ماذا تعلّمت في هذا الدرس؟
في ملخص الدرس أتقنت ضبط وسم نافذة العرض القياسي داخل رأس المستند، وفهمت الفرق بين البكسل المنطقي والفيزيائي ووحدة dvh وأهمية الحفاظ على حرية التكبير؛ وفي الخطوة التالية سننتقل إلى درس نظام Media Queries في لغة CSS لتطبيق القواعد الشرطية باحترافية عبر مختلف مقاسات الشاشات.