Semantic Nested Dropdown List Markupالبنية الدلالية للقوائم المنسدلة
صمم قوائم منسدلة احترافية بلغة CSS الخالصة عبر القوائم الدلالية المتداخلة والتموضع المنطقي ثنائي اللغة والانتقالات السلسة وجسر الفأرة الخفي ودعم التنقل الكامل بلوحة المفاتيح.
3 صفوف تعليمية
لغة CSS
0 مشاهدة
شرح صفوف ومحتوى الفقرة
الصف 1
شرح توضيحي
تبدأ القائمة المنسدلة المتينة ببنية HTML دلالية نظيفة قبل كتابة سطر تنسيق واحد؛ إذ نضع شريط التنقل داخل وسم <nav> يضم قائمة رئيسية <ul class="nav-bar">، وندرج القائمة الفرعية <ul class="submenu">مباشرة داخل عنصر الأب <li class="has-menu"> التابع لها.
يتيح تطبيق الصندوق المرن display: flex مع gap على القائمة الرئيسية رص الروابط العلوية أفقياً بانتظام، بينما يوفر احتواء العنصر الأب لقائمته الفرعية العلاقة الشجرية المباشرة اللازمة لفتح اللوحة بالأنماط الخالصة دون أي برمجة نصية.
الصف 2
صورة توضيحية
الصف 3
ملاحظة هامة
جميع فقرات هذا الدرس (القوائم المنسدلة في لغة CSS)
