Buuka ku bigambo ebikulu Buuka ku docs navigation
in English

Emmeeza

Ebiwandiiko n'ebyokulabirako by'okulonda-mu sitayiro y'emmeeza (okusinziira ku nkozesa yazo emanyiddwa mu JavaScript plugins) ne Bootstrap.

Ku muko guno

Okulaba okutwalira awamu

Olw'okukozesa ennyo <table>ebintu mu widgets ez'ekibiina eky'okusatu nga kalenda n'abalonda ennaku, emmeeza za Bootstrap zibeera opt-in . Yongera ku kiraasi y’omusingi .tableku yonna <table>, olwo ogaziye ne kiraasi zaffe ez’okukyusakyusa ez’okwesalirawo oba emisono egy’ennono. Sitayiro zonna ez'emmeeza tezisikira mu Bootstrap, ekitegeeza nti emmeeza zonna eziteekeddwa mu kisenge zisobola okukolebwa sitayiro nga zeetongodde ku muzadde.

Nga okozesa akabonero k'emmeeza akasinga obukulu, wuuno engeri .table-emmeeza ezisinziira ku ngeri gye zirabika mu Bootstrap.

# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table">
  <thead>
    <tr>
      <th scope="col">#</th>
      <th scope="col">First</th>
      <th scope="col">Last</th>
      <th scope="col">Handle</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th scope="row">1</th>
      <td>Mark</td>
      <td>Otto</td>
      <td>@mdo</td>
    </tr>
    <tr>
      <th scope="row">2</th>
      <td>Jacob</td>
      <td>Thornton</td>
      <td>@fat</td>
    </tr>
    <tr>
      <th scope="row">3</th>
      <td colspan="2">Larry the Bird</td>
      <td>@twitter</td>
    </tr>
  </tbody>
</table>

Enjawulo

Kozesa kiraasi ezikwata ku mbeera okukuba langi ku mmeeza, ennyiriri z’emmeeza oba obutoffaali obw’enjawulo.

Essomo Omutwe Omutwe
Okukosamu Ekatoffaali Ekatoffaali
Pulayimale Ekatoffaali Ekatoffaali
Ekyokubiri Ekatoffaali Ekatoffaali
Okuyita Ekatoffaali Ekatoffaali
Akabi Ekatoffaali Ekatoffaali
Okulabula Ekatoffaali Ekatoffaali
Info Ekatoffaali Ekatoffaali
Koleeza Ekatoffaali Ekatoffaali
Ekizikiza Ekatoffaali Ekatoffaali 
<!-- On tables -->
<table class="table-primary">...</table>
<table class="table-secondary">...</table>
<table class="table-success">...</table>
<table class="table-danger">...</table>
<table class="table-warning">...</table>
<table class="table-info">...</table>
<table class="table-light">...</table>
<table class="table-dark">...</table>

<!-- On rows -->
<tr class="table-primary">...</tr>
<tr class="table-secondary">...</tr>
<tr class="table-success">...</tr>
<tr class="table-danger">...</tr>
<tr class="table-warning">...</tr>
<tr class="table-info">...</tr>
<tr class="table-light">...</tr>
<tr class="table-dark">...</tr>

<!-- On cells (`td` or `th`) -->
<tr>
  <td class="table-primary">...</td>
  <td class="table-secondary">...</td>
  <td class="table-success">...</td>
  <td class="table-danger">...</td>
  <td class="table-warning">...</td>
  <td class="table-info">...</td>
  <td class="table-light">...</td>
  <td class="table-dark">...</td>
</tr>
Okutuusa amakulu mu tekinologiya ayamba

Okukozesa langi okwongera amakulu kiwa ekiraga ekirabika kyokka, ekitajja kutuusibwa eri abakozesa tekinologiya ayamba – gamba ng’ebisoma ku ssirini. Kakasa nti amawulire agalagirwa langi oba geeyoleka okuva mu birimu byennyini (okugeza ekiwandiiko ekirabika), oba gateekebwamu okuyita mu ngeri endala, gamba ng’ebiwandiiko ebirala ebikwekebwa ne .visually-hiddenkiraasi.

Emmeeza eziriko ennukuta

Ennyiriri eziriko emisono

Kozesa .table-stripedokwongera ku zebra-striping ku lunyiriri lwonna olw'emmeeza munda mu <tbody>.

# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-striped">
  ...
</table>

Ebika bino era bisobola okugattibwa ku nkyukakyuka z’emmeeza:

# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-dark table-striped">
  ...
</table>
# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-success table-striped">
  ...
</table>

Ennyiriri eziyinza okuwuuma

Okwongerako .table-hoverokusobozesa embeera ya hover ku nnyiriri z'emmeeza munda mu <tbody>.

# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-hover">
  ...
</table>
# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-dark table-hover">
  ...
</table>

Ennyiriri zino eziwuubaala nazo zisobola okugattibwa n’enkyukakyuka ey’emisono:

# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-striped table-hover">
  ...
</table>

Emmeeza ezikola

Laga olunyiriri oba akasenge k’emmeeza ng’ossaako .table-activeekibiina.

# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table">
  <thead>
    ...
  </thead>
  <tbody>
    <tr class="table-active">
      ...
    </tr>
    <tr>
      ...
    </tr>
    <tr>
      <th scope="row">3</th>
      <td colspan="2" class="table-active">Larry the Bird</td>
      <td>@twitter</td>
    </tr>
  </tbody>
</table>
# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-dark">
  <thead>
    ...
  </thead>
  <tbody>
    <tr class="table-active">
      ...
    </tr>
    <tr>
      ...
    </tr>
    <tr>
      <th scope="row">3</th>
      <td colspan="2" class="table-active">Larry the Bird</td>
      <td>@twitter</td>
    </tr>
  </tbody>
</table>

Enjawulo n’emmeeza eziriko ennukuta zikola zitya?

Ku mmeeza eziriko ennukuta ( ennyiriri eziriko emisono , ennyiriri eziwuubaala , n'emmeeza ezikola ), twakozesa obukodyo obumu okufuula ebikolwa bino okukola ku nkyukakyuka zaffe zonna ez'emmeeza :

  • Tutandika nga tuteeka emabega w’akasengejja k’emmeeza n’ekintu --bs-table-bgeky’ennono. Enkyukakyuka zonna ez'emmeeza olwo ziteekawo ekintu ekyo eky'ennono okukuba langi ku butoffaali bw'emmeeza. Mu ngeri eno, tetufuna buzibu singa langi ezitali zitangaavu zikozesebwa nga emmeeza ennyuma.
  • Olwo ne twongerako ekisiikirize ky'akabokisi akayingiza ku butoffaali bw'emmeeza nga tulina box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);to layer waggulu wa kyonna ekiragiddwa background-color. Olw’okuba tukozesa spread ennene ennyo ate nga tewali blur, langi ejja kuba monotone. Okuva bwe kiri --bs-table-accent-bgnti is unset by default, tetulina kisiikirize kya box ekisookerwako.
  • Bwe oba .table-striped, .table-hoveroba .table-activekiraasi zigattibwako, the --bs-table-accent-bgeteekebwa ku langi ya semitransparent okuteeka langi ku mugongo.
  • Ku buli nkyukakyuka y’emmeeza, tukola --bs-table-accent-bglangi erimu enjawulo esinga okusinziira ku langi eyo. Okugeza langi ya accent for .table-primaryesingako enzirugavu ate .table-darkng’erina langi ya accent eyaka.
  • Langi z'ebiwandiiko n'ensalosalo zikolebwa mu ngeri y'emu, era langi zazo zisikira mu butonde.

Emabega w’empenda kirabika bwe kiti:

@mixin table-variant($state, $background) {
  .table-#{$state} {
    $color: color-contrast(opaque($body-bg, $background));
    $hover-bg: mix($color, $background, percentage($table-hover-bg-factor));
    $striped-bg: mix($color, $background, percentage($table-striped-bg-factor));
    $active-bg: mix($color, $background, percentage($table-active-bg-factor));

    --#{$variable-prefix}table-bg: #{$background};
    --#{$variable-prefix}table-striped-bg: #{$striped-bg};
    --#{$variable-prefix}table-striped-color: #{color-contrast($striped-bg)};
    --#{$variable-prefix}table-active-bg: #{$active-bg};
    --#{$variable-prefix}table-active-color: #{color-contrast($active-bg)};
    --#{$variable-prefix}table-hover-bg: #{$hover-bg};
    --#{$variable-prefix}table-hover-color: #{color-contrast($hover-bg)};

    color: $color;
    border-color: mix($color, $background, percentage($table-border-factor));
  }
}

Ensalosalo z’emmeeza

Emmeeza eziriko ensalosalo

Gattako .table-borderedfor borders ku njuyi zonna ez'emmeeza n'obutoffaali.

# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-bordered">
  ...
</table>

Ebikozesebwa mu langi z’ensalosalo bisobola okugattibwako okukyusa langi:

# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-bordered border-primary">
  ...
</table>

Emmeeza ezitaliiko nsalo

Okwongerako .table-borderlessku mmeeza etaliimu nsalo.

# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-borderless">
  ...
</table>
# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-dark table-borderless">
  ...
</table>

Emmeeza entonotono

Okwongerako .table-smokufuula ekintu kyonna .tableekikwatagana ng’osala obutoffaali bwonna paddingmu bitundu bibiri.

# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-sm">
  ...
</table>
# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-dark table-sm">
  ...
</table>

Okulaganya okw’okwesimbye

Obutoffaali bw’emmeeza obwa <thead>bulijjo buba bukwatagana mu nneekulungirivu wansi. Obutoffaali bw'emmeeza mu <tbody>busikira okulaganya kwabwo okuva <table>era bukwatagana ku the top by default. Kozesa kiraasi za vertical align okuddamu okulaganya we kyetaagisa.

Omutwe 1 Omutwe 2 Omutwe 3 Omutwe 4
Akatoffaali kano kasikira vertical-align: middle;okuva ku mmeeza Akatoffaali kano kasikira vertical-align: middle;okuva ku mmeeza Akatoffaali kano kasikira vertical-align: middle;okuva ku mmeeza Kino wano waliwo ebiwandiiko ebimu eby’ekifo, ebigendereddwamu okutwala ekifo ekitono ennyo ekyesimbye, okulaga engeri ensengeka eyeesimbye gy’ekola mu butoffaali obusoose.
Akatoffaali kano kasikira vertical-align: bottom;okuva mu lunyiriri lw'emmeeza Akatoffaali kano kasikira vertical-align: bottom;okuva mu lunyiriri lw'emmeeza Akatoffaali kano kasikira vertical-align: bottom;okuva mu lunyiriri lw'emmeeza Kino wano waliwo ebiwandiiko ebimu eby’ekifo, ebigendereddwamu okutwala ekifo ekitono ennyo ekyesimbye, okulaga engeri ensengeka eyeesimbye gy’ekola mu butoffaali obusoose.
Akatoffaali kano kasikira vertical-align: middle;okuva ku mmeeza Akatoffaali kano kasikira vertical-align: middle;okuva ku mmeeza Akatoffaali kano kakwatagana okutuuka waggulu. Kino wano waliwo ebiwandiiko ebimu eby’ekifo, ebigendereddwamu okutwala ekifo ekitono ennyo ekyesimbye, okulaga engeri ensengeka eyeesimbye gy’ekola mu butoffaali obusoose. 
<div class="table-responsive">
  <table class="table align-middle">
    <thead>
      <tr>
        ...
      </tr>
    </thead>
    <tbody>
      <tr>
        ...
      </tr>
      <tr class="align-bottom">
        ...
      </tr>
      <tr>
        <td>...</td>
        <td>...</td>
        <td class="align-top">This cell is aligned to the top.</td>
        <td>...</td>
      </tr>
    </tbody>
  </table>
</div>

Okuzimba ebisu

Emisono gy'ensalosalo, sitayiro ezikola, n'enjawulo z'emmeeza tezisikira mmeeza eziteekeddwa mu kisenge.

# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
Omutwe Omutwe Omutwe
OMU Okusooka Okusembayo
B. B Okusooka Okusembayo
C. C. Omuntu w’abantu Okusooka Okusembayo
3. Larry Ekinyonyi @twitter 
<table class="table table-striped">
  <thead>
    ...
  </thead>
  <tbody>
    ...
    <tr>
      <td colspan="4">
        <table class="table mb-0">
          ...
        </table>
      </td>
    </tr>
    ...
  </tbody>
</table>

Engeri okuteeka ebisu gye kukolamu

Okuziyiza sitayiro zonna okukulukuta ku mmeeza eziteekeddwa mu kisenge, tukozesa ekisunsula eky’okugatta omwana ( >) mu CSS yaffe. Okuva bwe twetaaga okutunuulira tds ne ths zonna mu thead, tbody, ne tfoot, selector yaffe yandirabise nga mpanvu nnyo awatali yo. Nga bwe kiri, tukozesa .table > :not(caption) > * > *ekisunsula ekirabika obulungi ennyo okutunuulira tds ne ths zonna eza .table, naye tewali ku mmeeza yonna eyinza okubeera nested.

Weetegereze nti bw’ogattako <tr>s ng’abaana obutereevu ab’emmeeza, abo <tr>bajja kuzingibwa mu a <tbody>nga bwe kibadde, bwe kityo ne kifuula abasunsula baffe okukola nga bwe kigendereddwa.

Ensengekera y’omubiri

Omutwe gw’emmeeza

Okufaananako n’emmeeza n’emmeeza enzirugavu, kozesa ebika by’ebikyusa .table-lightoba .table-darkokufuula <thead>s okulabika ng’enzirugavu enzirugavu oba enzirugavu.

# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table">
  <thead class="table-light">
    ...
  </thead>
  <tbody>
    ...
  </tbody>
</table>
# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table">
  <thead class="table-dark">
    ...
  </thead>
  <tbody>
    ...
  </tbody>
</table>

Ekigere ky’emmeeza

# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter
Wansi wansi Wansi wansi Wansi wansi Wansi wansi 
<table class="table">
  <thead>
    ...
  </thead>
  <tbody>
    ...
  </tbody>
  <tfoot>
    ...
  </tfoot>
</table>

Ebigambo ebiwandiikiddwa ku bigambo

A <caption>ekola nga omutwe gw’emmeeza. Kiyamba abakozesa abalina screen readers okuzuula emmeeza n’okutegeera kye kikwatako ne basalawo oba baagala okugisoma.

Olukalala lw'abakozesa
# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table table-sm">
  <caption>List of users</caption>
  <thead>
    ...
  </thead>
  <tbody>
    ...
  </tbody>
</table>

Osobola n'okuteeka <caption>waggulu ku mmeeza nga .caption-top.

Olukalala lw'abakozesa
# . Okusooka Okusembayo Okukwaata
1. Mark Otto bwe yabadde @mdo
2. Yakobo Thornton nga bwe kiri @obunene
3. Larry Ekinyonyi @twitter 
<table class="table caption-top">
  <caption>List of users</caption>
  <thead>
    <tr>
      <th scope="col">#</th>
      <th scope="col">First</th>
      <th scope="col">Last</th>
      <th scope="col">Handle</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th scope="row">1</th>
      <td>Mark</td>
      <td>Otto</td>
      <td>@mdo</td>
    </tr>
    <tr>
      <th scope="row">2</th>
      <td>Jacob</td>
      <td>Thornton</td>
      <td>@fat</td>
    </tr>
    <tr>
      <th scope="row">3</th>
      <td>Larry</td>
      <td>the Bird</td>
      <td>@twitter</td>
    </tr>
  </tbody>
</table>

Emmeeza eziddamu

Emmeeza eziddamu zisobozesa emmeeza okutambula mu bbanga mu ngeri ennyangu. Fuula emmeeza yonna okuddamu mu bifo byonna eby'okulaba ng'ozinga a .tablene .table-responsive. Oba, londa ekifo ekisinga obunene eky’okumenyawo kw’olina okuba n’emmeeza eddamu okutuukako ng’okozesa .table-responsive{-sm|-md|-lg|-xl|-xxl}.

Okusala/okusalako mu ngeri eyeesimbye

Emmeeza eziddamu zikozesa overflow-y: hidden, esalako ebirimu byonna ebisukka wansi oba waggulu ku mbiriizi z’emmeeza. Okusingira ddala, kino kiyinza okusalako menu ezikka wansi ne widgets endala ez’ekibiina eky’okusatu.

Bulijjo addamu

Across buli breakpoint, kozesa .table-responsiveku horizontally scrolling emmeeza.

# . Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe
1. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
2. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
3. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali 
<div class="table-responsive">
  <table class="table">
    ...
  </table>
</div>

Breakpoint eyeetongodde

Kozesa .table-responsive{-sm|-md|-lg|-xl|-xxl}nga bwe kyetaagisa okukola emmeeza eziddamu okutuuka ku kifo ekimu eky’okumenyawo. Okuva ku kifo ekyo eky’okumenya n’okudda waggulu, emmeeza ejja kweyisa mu ngeri eya bulijjo so si kutambula mu bbanga.

Emmeeza zino ziyinza okulabika nga zimenyese okutuusa nga sitayiro zazo ez'okuddamu zikola ku bugazi bw'ekifo eky'okulaba obw'enjawulo.

# . Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe
1. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
2. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
3. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
# . Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe
1. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
2. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
3. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
# . Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe
1. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
2. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
3. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
# . Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe
1. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
2. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
3. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
# . Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe
1. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
2. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
3. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
# . Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe Omutwe
1. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
2. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali
3. Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali Ekatoffaali 
<div class="table-responsive">
  <table class="table">
    ...
  </table>
</div>

<div class="table-responsive-sm">
  <table class="table">
    ...
  </table>
</div>

<div class="table-responsive-md">
  <table class="table">
    ...
  </table>
</div>

<div class="table-responsive-lg">
  <table class="table">
    ...
  </table>
</div>

<div class="table-responsive-xl">
  <table class="table">
    ...
  </table>
</div>

<div class="table-responsive-xxl">
  <table class="table">
    ...
  </table>
</div>

Sass nga bwe kiri

Enkyukakyuka ezikyukakyuka

$table-cell-padding-y:        .5rem;
$table-cell-padding-x:        .5rem;
$table-cell-padding-y-sm:     .25rem;
$table-cell-padding-x-sm:     .25rem;

$table-cell-vertical-align:   top;

$table-color:                 $body-color;
$table-bg:                    transparent;
$table-accent-bg:             transparent;

$table-th-font-weight:        null;

$table-striped-color:         $table-color;
$table-striped-bg-factor:     .05;
$table-striped-bg:            rgba($black, $table-striped-bg-factor);

$table-active-color:          $table-color;
$table-active-bg-factor:      .1;
$table-active-bg:             rgba($black, $table-active-bg-factor);

$table-hover-color:           $table-color;
$table-hover-bg-factor:       .075;
$table-hover-bg:              rgba($black, $table-hover-bg-factor);

$table-border-factor:         .1;
$table-border-width:          $border-width;
$table-border-color:          $border-color;

$table-striped-order:         odd;

$table-group-separator-color: currentColor;

$table-caption-color:         $text-muted;

$table-bg-scale:              -80%;

Kyabulijo

$table-variants: (
  "primary":    shift-color($primary, $table-bg-scale),
  "secondary":  shift-color($secondary, $table-bg-scale),
  "success":    shift-color($success, $table-bg-scale),
  "info":       shift-color($info, $table-bg-scale),
  "warning":    shift-color($warning, $table-bg-scale),
  "danger":     shift-color($danger, $table-bg-scale),
  "light":      $light,
  "dark":       $dark,
);

Okulongoosa

  • Enkyukakyuka z’ensonga ( $table-striped-bg-factor, $table-active-bg-factor& $table-hover-bg-factor) zikozesebwa okuzuula enjawulo mu nkyukakyuka z’emmeeza.
  • Ng’oggyeeko enkyukakyuka z’emmeeza ez’ekitangaala & enzirugavu, langi z’omulamwa zitangalizibwa $table-bg-levelenkyukakyuka.