MediaWiki/Bootstrap: Unterschied zwischen den Versionen

Aus Foxwiki
Wechseln zu:Navigation, Suche
Zeile 87: Zeile 87:
   </div>
   </div>
</div>
</div>
; Code
<syntaxhighlight lang="html" highlight="" line copy>
<div class="container">
  <div class="row">
    <div class="col">
      1 of 2
    </div>
    <div class="col">
      2 of 2
    </div>
  </div>
  <div class="row">
    <div class="col">
      1 of 3
    </div>
    <div class="col">
      2 of 3
    </div>
    <div class="col">
      3 of 3
    </div>
  </div>
</div>
</syntaxhighlight>

Version vom 7. August 2026, 10:42 Uhr

Accordion

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Code
<bootstrap_accordion>
<bootstrap_card header="Lorem ipsum 1" style="width: 300px;">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
</bootstrap_card>
<bootstrap_card header="Lorem ipsum 2" style="width: 300px;">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
</bootstrap_card>
</bootstrap_accordion>

list-group

  • A simple default list group item
  • A simple primary list group item
  • A simple secondary list group item
  • A simple success list group item
  • A simple danger list group item
Code
<ul class="list-group">
  <li class="list-group-item">A simple default list group item</li>
  <li class="list-group-item list-group-item-primary">A simple primary list group item</li>
  <li class="list-group-item list-group-item-secondary">A simple secondary list group item</li>
  <li class="list-group-item list-group-item-success">A simple success list group item</li>
  <li class="list-group-item list-group-item-danger">A simple danger list group item</li>
</ul>

Tabelle

# First Last Handle
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
Code
{| class="table table-striped table-hover sortable"
! scope="col" | # !! First !! Last !! Handle
|-
| scope="row" | 1 || Mark || Otto || @mdo
|-
| scope="row" | 2 || Jacob || Thornton || @fat
|-
| scope="row" | 3 || Larry || the Bird || @twitter
|}

Grid

     1 of 2
     2 of 2
     1 of 3
     2 of 3
     3 of 3
Code
<div class="container">
  <div class="row">
    <div class="col">
      1 of 2
    </div>
    <div class="col">
      2 of 2
    </div>
  </div>
  <div class="row">
    <div class="col">
      1 of 3
    </div>
    <div class="col">
      2 of 3
    </div>
    <div class="col">
      3 of 3
    </div>
  </div>
</div>