گروه لیست

تغییر

گروه های لیست یک جزء منعطف و قدرتمند برای نمایش یک سری محتوا هستند.

اضافه کردن.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.

  1. یک آیتم لیست
  2. یک آیتم لیست
  3. یک آیتم لیست

نشان ها

اضافه کردنBadges to any list group item to show unread counts, activity, and more with the help of some خدمات رفاهی.

  • یک آیتم لیست14
  • مورد دوم لیست2
  • مورد سوم لیست1
© Clivax.
ساخته شده باتوسطCodebucks