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

Flush Borderless Lists القوائم المدمجة بدون إطار

تعلّم بناء مجموعات القوائم في بوتستراب 5.3 بحالاتها النشطة والمعطلة، وقوائم الروابط والأزرار التفاعلية، والقوائم المدمجة داخل البطاقات، والترقيم التلقائي، ودمج الشارات.
2 صفوف تعليمية
بوتستراب 5
1 مشاهدة

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

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

إذا وضعت قائمة مؤطرة عادية داخل مكوّن .card الذي تعلمناه في الدرس السابق، سيتكون إطاران مزدوجان قبيحان على الجانبين! يعالج الكلاس .list-group-flush ذلك بحذف الإطار الخارجي واستدارة الزوايا، لتلتحم فواصل القائمة الأفقية بحواف البطاقة بتناغم معماري رائع.

الصف 2 كود برمجي
HTML 
<div class="card">
  <div class="card-header fw-bold">Server Regions</div>
  <ul class="list-group list-group-flush">
    <li class="list-group-item">Riyadh (me-central)</li>
    <li class="list-group-item">Frankfurt (eu-central)</li>
  </ul>
</div>
جرّب بنفسك

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