Eksempel på opbygning af tabellayout:

overskrift

txt1

txt2

txt1

txt2

Kopier denne kode til dit projekt:

<div class="container-fluid">
  <div class="row">
    <div class="col-md-12 border border-bottom-0 border-info" style="padding: 10px;">
      <p><strong>overskrift</strong></p>
    </div>
  </div>
  <div class="row">
    <div class="col-md-6 border border-bottom-0 border-info" style="padding: 10px;">
      <p>txt1</p>
    </div>
    <div class="col-md-6 border border-bottom-0 border-info" style="padding: 10px;">
      <p>txt2</p>
    </div>
  </div>
  <div class="row">
    <div class="col-md-6 border border-bottom-0 border-info" style="padding: 10px;">
      <p>txt1</p>
    </div>
    <div class="col-md-6 border border-bottom-0 border-info" style="padding: 10px;">
      <p>txt2</p>
    </div>
  </div>
  <div class="row">
    <div class="col-md-6 border border-bottom-1 border-info" style="padding: 10px;">
      <p>txt1</p>
    </div>
    <div class="col-md-6 border border-bottom-1 border-info" style="padding: 10px;">
      <p>txt2</p>
    </div>
  </div>
</div>
Sådan tilpasser du koden:
  • Farver og kanter:
    • Ønsker du at ændre farven på kanterne, skal du erstatte border-info med en anden Bootstrap-farveklasse, fx border-primary, border-success eller border-danger.
    • Hvis du vil bruge en specifik farve, kan du tilføje en inline style, fx:
      style="border-color: #3f5b58;"
  • Baggrundsfarve:
    • Tilføj en baggrundsfarve ved at tilføje en inline style, fx:
      style="background-color: #f8f9fa;"
  • Padding (indrykning):
    • Juster afstanden mellem indholdet og kanten ved at ændre padding, fx:
      style="padding: 15px;"
  • Kolonner:
    • Ønsker du at ændre bredden på kolonnerne, kan du justere col-md-6 til fx col-md-4 for smallere kolonner eller col-md-12 for fuld bredde.
آخر تعديل: الثلاثاء، 8 سبتمبر 2026، 5:05 PM