Grid tabel med streger
متطلبات الإكمال
Indhold her
Indhold her
Indhold her
Indhold her
Indhold her
Indhold her
Kopier denne kode til dit projekt:
<div class="container-fluid">
<!-- Første række -->
<div class="row">
<div class="col-md-6 border border-bottom-0 border-info" style="padding: 15px; background-color: #f8f9fa;">
<p>Indhold her</p>
</div>
<div class="col-md-6 border border-bottom-0 border-info" style="padding: 15px; background-color: #f8f9fa;">
<p>Indhold her</p>
</div>
</div>
<!-- Gentag for flere rækker (uden mellemrum) -->
<div class="row">
<div class="col-md-6 border border-bottom-0 border-info" style="padding: 15px; background-color: #f8f9fa;">
<p>Indhold her</p>
</div>
<div class="col-md-6 border border-bottom-0 border-info" style="padding: 15px; background-color: #f8f9fa;">
<p>Indhold her</p>
</div>
</div>
<!-- Sidste række (med bundlinje) -->
<div class="row">
<div class="col-md-6 border border-info" style="padding: 15px; background-color: #f8f9fa; border-bottom: 1px solid #17a2b8;">
<p>Indhold her</p>
</div>
<div class="col-md-6 border border-info" style="padding: 15px; background-color: #f8f9fa; border-bottom: 1px solid #17a2b8;">
<p>Indhold her</p>
</div>
</div>
</div>
3. Sådan tilpasser du koden
Her er en vejledning til at tilpasse farver, stil og layout:
- Farver:
- Baggrundsfarve: Ændres i
background-color. Standard:#f8f9fa(lys grå). Eksempel:background-color: #e9ecef;. - Rammefarve: Brug Bootstrap 5-klasser som
border-info(blå),border-success(grøn) ellerborder-danger(rød). Alternativt:style="border: 1px solid #3f5b58;". - Bundlinje: Juster tykkelse og farve med
border-bottom: 2px solid #3f5b58;.
- Baggrundsfarve: Ændres i
- Padding (indrykning): Juster afstanden mellem indhold og ramme med
padding: 20px;. - Kolonner: Skift bredde ved at ændre
col-md-6til fxcol-md-4for tre kolonner. - Tekstfarve: Tilføj
style="color: #3f5b58;"for at ændre tekstfarven. - Skygge og kantradius: Tilføj
style="box-shadow: 3px 3px 5px rgba(0,0,0,0.1); border-radius: 5px;"for skygge og afrundede hjørner.
آخر تعديل: الثلاثاء، 8 سبتمبر 2026، 5:28 PM