« Bootstrap 5 » : différence entre les versions

De Banane Atomic
Aller à la navigationAller à la recherche
Ligne 7 : Ligne 7 :
! Description
! Description
|-
|-
| mt-0 || margin-top: 0 !important
| m-0 || margin: 0 !important
|-
| p-3 || padding: 1rem !important
|-
|-
| mx-auto || margin-right: auto !important<br>margin-left: auto !important
| mx-auto || margin-right: auto !important<br>margin-left: auto !important
|-
| p-3 || padding: $spacer !important
|}
|}
{{info |1= Values from 0 to 5<br>
{{boxx|1= 1=0.25rem}} {{boxx|1= 2=0.5rem}} {{boxx|1= 3=1rem}} {{boxx|1= 4=1.5rem}} {{boxx|1= 5=3rem}}<br>
$spacer = 1rem, rem = root em = font-size defined in <html>}}


{| class="wikitable wtp wtmono1"
{| class="wikitable wtp wtmono1"
Ligne 33 : Ligne 30 :
|-
|-
| y || top and bottom
| y || top and bottom
|}
{| class="wikitable wtp"
! Value
! Description
|-
| 0 || 0
|-
| 1 || $spacer * .25 = 0.25rem
|-
| 2 || $spacer * .5 = 0.5rem
|-
| 3 || $spacer = 1rem
|-
| 4 || $spacer * 1.5 = 1.5rem
|-
| 5 || $spacer * 3 = 3rem
|-
| auto || auto
|}
|}



Version du 15 mai 2021 à 19:31

Utilities

Margin / Padding

classe Description
m-0 margin: 0 !important
p-3 padding: 1rem !important
mx-auto margin-right: auto !important
margin-left: auto !important
Sides
Side Description
t top
b bottom
s start (left in LTR)
e end (right in LTR)
x left and right
y top and bottom
Value Description
0 0
1 $spacer * .25 = 0.25rem
2 $spacer * .5 = 0.5rem
3 $spacer = 1rem
4 $spacer * 1.5 = 1.5rem
5 $spacer * 3 = 3rem
auto auto

Text

classe Description
text-center centrer aligned text
text-end end (right) aligned text
text-uppercase uppercased text
fw-bold bold text

Components

Collapse

Html.svg
<a data-bs-toggle="collapse" href="#filter" role="button" aria-expanded="false" aria-controls="filter">
    <i class="fa fa-filter"></i>
</a>

<div class="collapse" id="filter">
</div>

Migrating to v5