انتقل إلى محتوى الدرس
ابدأ رحلتك
فقرة فرعية #4 من درس: القوائم المطوية Accordion في بوتستراب 5

Always Open Accordions إبقاء عدة أقسام مفتوحة معاً

ابنِ قوائم الأسئلة الشائعة ولوحات التصفية بمكوّن الأكورديون الأصيل في بوتستراب 5، وأتقن هيكله القياسي والفتح الحصري بسمة data-bs-parent ونمط البقاء مفتوحاً والأكورديون المدمج وإتاحة العربية.
2 صفوف تعليمية
بوتستراب 5
1 مشاهدة

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

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

في كثير من واجهات المتاجر ولوحات التصفية الجانبية يحتاج الزائر إلى فتح قسم «الماركة» وقسم «نطاق السعر» وقسم «التقييم» معاً في وقت واحد دون أن يغلق أحدها الآخر. لتحقيق هذا السلوك، احذف السمة data-bs-parent تماماً من عناصر .accordion-collapse فتصبح كل لوحة مستقلة بذاتها.

الصف 2 كود برمجي
HTML 
<div class="accordion" id="filterAcc">
  <div class="accordion-item">
    <h2 class="accordion-header">
      <button class="accordion-button" type="button"
        data-bs-toggle="collapse" data-bs-target="#f1">
        Category Filter</button>
    </h2>
    <div id="f1" class="accordion-collapse collapse show">
      <div class="accordion-body">Laptops, Monitors</div>
    </div></div>
</div>
جرّب بنفسك

جميع فقرات هذا الدرس (القوائم المطوية Accordion في بوتستراب 5)