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

CSS hide element with media Query إخفاء بعض العناصر بنظام media Query في لغة CSS

سوف تتعلم في هذا الدرس أمثلة متنوعة علي نظام media query في لغة CSS وكيفية إستخدام هذا النظام مع خطوط وألوان وأحجام العناصر وعمل تصميمات مختلفة علي حسب حجم كل شاشة.

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

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

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

استخدام media query مع عنصر أو بعض العناصر أو كل العناصر لأخفائها علي بعض الشاشات أو شاشة محددة وهو يعد أمر شائع في لغة CSS.

CSS hide element with media Query

سوف يختفي عرض عنصر p علي أي حجم شاشة أصغر 600px والعكس في الشاشات الاكبر من 600px.

HTML
/* If the screen size is 600px wide or less, hide the element */
@media (max-width: 600px) {
  p 
  {
    display: none;
  }
}