ابزار سایزبندی

کامپوننت ها

با ابزارهای عرض و ارتفاع ما، به راحتی یک عنصر را به عرض یا ارتفاع بسازید.

این کلاس های کاربردی اجازه می دهند که عرض یک عنصر را فورا تنظیم کنید.

25%

50%

75%

100%

درصد عرض	مقدار
`.w-{value}`	15 \| 20 \| 25 \| 30 \| ... \| 85 \| 90 \| 95 \| 100 (5 قدم)

عرض مورد استفاده	مقدار
`.wide-{value}`	xs \| sm \| md \| lg \| xl
این کلاس ها بیشتر با `.container` به عرض خاص در هر صفحه نمایش بزرگتر استفاده می شوند.

عرض خاص	مقدار
`.w-{value}`	80px \| 90px \| 100px \| 110px \| 120px \| 125px \| 130px \| 140px \| 150px \| 175px \| 200px \| 220px \| 225px \| 250px \| 300px \| 350px \| 400px \| 550px
`.w-max-{value}`	مانند بالا
`.w-min-{value}`	مانند بالا

تمام عرض	مقدار
`.w-{value}`	auto \| 100	برای بازنشانی از `auto` استفاده کنید
`.w-max-{value}`	auto \| 100	برای بازنشانی از `auto` استفاده کنید
`.w-min-{value}`	auto \| 100	برای بازنشانی از `auto` استفاده کنید
`.mw-100`		مانند `.w-max-100`

مثال استفاده

<div class="w-25"> ... </div>
<div class="w-max-250px"> ... </div>
<div class="w-min-100px"> ... </div>

این کلاس های کاربردی اجازه می دهند که عرض یک عنصر را فورا تنظیم کنید.

25%

50%

75%

100%

درصد ارتفاع	مقدار
`.h-{value}`	25 \| 50 \| 75 \| 100 \| auto
`.mh-100`	تنظیم حداکثر ارتفاع 100%

ارتفاع خاص	مقدار
`.h-{value}`	100px \| 150px \| 175px \| 200px \| 225px \| 250px \| 275px \| 300px \| 325px \| 350px \| 375px \| 400px \| 425px \| 450px \| 475px \| 500px
`.h-max-{value}`	مانند بالا
`.h-min-{value}`	مانند بالا

مثال استفاده

<div class="h-25"> ... </div>
<div class="h-250px"> ... </div>
<div class="h-min-325px"> ... </div>

همچنین می توانید از ابزارهای کمکی برای تنظیم عرض و ارتفاع نسبت به درگاه دید استفاده کنید.

مثال استفاده

<div class="vh-100"> ... </div>