Qhov loj me

Yooj yim ua ib lub caij kom dav lossis siab (kwv yees rau nws niam nws txiv) nrog peb qhov dav thiab qhov siab qhov hluav taws xob.

Qhov dav thiab qhov siab qhov hluav taws xob yog tsim los ntawm $sizesSass daim ntawv qhia hauv _variables.scss. Xws li kev txhawb nqa rau 25%, 50%, 75%, thiab 100%los ntawm lub neej ntawd. Hloov kho cov txiaj ntsig raws li koj xav tau los tsim cov khoom siv sib txawv ntawm no.

Dav 25%

Dav 50%

Dav 75%

Dav 100%

<div class="w-25 p-3" style="background-color: #eee;">Width 25%</div>
<div class="w-50 p-3" style="background-color: #eee;">Width 50%</div>
<div class="w-75 p-3" style="background-color: #eee;">Width 75%</div>
<div class="w-100 p-3" style="background-color: #eee;">Width 100%</div>

Qhov siab 25%

Qhov siab 50%

Qhov siab 75%

Qhov siab 100%

<div style="height: 100px; background-color: rgba(255,0,0,0.1);">
  <div class="h-25 d-inline-block" style="width: 120px; background-color: rgba(0,0,255,.1)">Height 25%</div>
  <div class="h-50 d-inline-block" style="width: 120px; background-color: rgba(0,0,255,.1)">Height 50%</div>
  <div class="h-75 d-inline-block" style="width: 120px; background-color: rgba(0,0,255,.1)">Height 75%</div>
  <div class="h-100 d-inline-block" style="width: 120px; background-color: rgba(0,0,255,.1)">Height 100%</div>
</div>

Koj tseem tuaj yeem siv max-width: 100%;thiab max-height: 100%;cov khoom siv hluav taws xob raws li xav tau.

<img class="mw-100" src="..." alt="Max-width 100%">

Max-siab 100%

<div style="height: 100px; background-color: rgba(255,0,0,0.1);">
  <div class="mh-100" style="width: 100px; height: 200px; background-color: rgba(0,0,255,0.1);">Max-height 100%</div>
</div>