انتقل إلى محتوى الدرس

CSS Media Query نظام media query في لغة CSS

سوف تتعلم في هذا الدرس CSS media queries وكيف تعمل ولماذا تستخدم مع صفحات الويب وعلاقتها بالتصميمات المتجاوبة,

1 صفوف تعليمية
لغة CSS
7,547 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

media queries هو نظام أو تقنية حديثة داخل لغة CSS صمم خصيصاً لتطبيق استثناءات علي عناصر HTML بناء علي حجم viewport الحالي,وهو تطبيق نمط أو شكل معين علي كل أو بعض عناصر صفحة الويب بشروط أو قواعد معينة علي شاشات محددة وشاشات أخري نمط مختلف.


توضيح: فمثلاً في حجم medium screens الشاشات المتوسطة يمكن ان يكون عنصر <h1> بلون أحمر في الوضوع الطبيعي وعن طريق نظام media queries نقوم بتحديد هذا العنصر ليتم تطبيق عليه استثناء وهو أن يكون العنصر بلون أخضر علي small screens الشاشات الصغيرة فعندما يتم فتح صفحة الويب علي شاشة متوسطة يكون باللون الأحمر وعندما تفتح صفحة الويب علي شاشة صغيره الحجم يكون عنصر <h1> باللون الأخضر وهكذا يمكن عمل استثناءات علي شاشات أخري.



نظام media query في لغة CSS