گروه لیست
تغییر
گروه های لیست یک جزء منعطف و قدرتمند برای نمایش یک سری محتوا هستند.
اضافه کردن.list-group-flush
to remove some borders and rounded corners to render list group items edge-to-edge in a parent container (e.g., cards).
پیش فرض
- یک آیتم
- یک مورد دوم
- مورد سوم
- مورد چهارم
- و پنجمی
فلاش
- یک آیتم
- یک مورد دوم
- مورد سوم
- مورد چهارم
- و پنجمی
رنگ متنی
از کلاس های متنی برای استایل دادن به آیتم های لیست با پس زمینه و رنگ حالت دار استفاده کنید.
افقی
اضافه کردن.list-group-horizontal
to change the layout of list group items from vertical to horizontal across all breakpoints. Alternatively, choose a responsive variant .list-group-horizontal-{sm|md|lg|xl|xxl}
to make a list group horizontal starting at that breakpoint’s min-width
. Currently گروه های لیست افقی را نمی توان با گروه های لیست تراز ترکیب کرد.
- Cras justo odio
- Dapibus ac facilisis in
- موربی لئو ریسوس
چک باکس ها و رادیوها
چک باکس ها و رادیوهای Bootstrap را در لیست موارد گروه قرار دهید و در صورت نیاز سفارشی کنید. <label>
s.
- First checkbox
- Second checkbox
- Third checkbox
- Fourth checkbox
- Fifth checkbox
و اگر بخواهید<label>
s as the .list-group-item
for large hit areas, you can do that, too.
- First radio
- Second radio
- Third radio
- Fourth radio
- Fifth radio
لینک ها و دکمه ها
استفاده کنید<a>
s or <button>
s to create actionable list group items with hover, disabled, and active states by adding .list-group-item-action
. We separate these pseudo-classes to ensure list groups made of non-interactive elements (like <li>
s or <div>
s) don’t provide a click or tap affordance.
دکمه ها
ایالت ها
اضافه کردن.active
to a .list-group-item
to indicate the current active selection.
اضافه کردن.disabled
to a .list-group-item
to make it appear disabled. Note that some elements with .disabled
will also require custom JavaScript to fully disable their click events (e.g., links).
- یک آیتم فعال
- یک مورد غیر فعال
- مورد سوم
- مورد چهارم
- و پنجمی
شماره گذاری شده است
اضافه کردن.list-group-numbered
modifier class (and optionally use an <ol>
element) to opt into numbered list group items. Numbers are generated via CSS (as opposed to a <ol>
s default browser styling) for better placement inside list group items and to allow for better customization.
- یک آیتم لیست
- یک آیتم لیست
- یک آیتم لیست
نشان ها
اضافه کردنBadges to any list group item to show unread counts, activity, and more with the help of some خدمات رفاهی.
- یک آیتم لیست14
- مورد دوم لیست2
- مورد سوم لیست1
مطالب اضافی
تقریباً هر HTML را در داخل اضافه کنید، حتی برای گروه های لیست پیوندی مانند زیر، با کمکflexbox utilities.
عنوان مورد گروه را فهرست کنید
3 روز پیشبرخی از محتوای جایگیر در یک پاراگراف.
و مقداری چاپ کوچکعنوان مورد گروه را فهرست کنید
3 روز پیشبرخی از محتوای جایگیر در یک پاراگراف.
و تعدادی چاپ کوچک خاموش.عنوان مورد گروه را فهرست کنید
3 روز پیشبرخی از محتوای جایگیر در یک پاراگراف.
و تعدادی چاپ کوچک خاموش.