Source

فلوٽ

اسان جي جوابي فلوٽ يوٽيلٽيز کي استعمال ڪندي، ڪنهن به عنصر تي، ڪنهن به بريڪ پوائنٽ تي فلوٽ کي ٽوگل ڪريو.

اوسر

اهي يوٽيلٽي ڪلاس هڪ عنصر کي کاٻي يا ساڄي طرف فلوٽ ڪن ٿا، يا فلوٽنگ کي غير فعال ڪن ٿا، موجوده ويوپورٽ سائيز جي بنياد تي CSS floatپراپرٽي استعمال ڪندي . !importantمخصوص مسئلن کان بچڻ لاء شامل آهي. اهي اسان جي گرڊ سسٽم جي طور تي ساڳيا viewport بريڪ پوائنٽ استعمال ڪندا آهن.

ڪلاس

ڪلاس سان فلوٽ کي ٽوگل ڪريو:

فلوٽ کاٻي پاسي سڀني viewport سائزن تي

سڄي وييو پورٽ جي سائيز تي فلوٽ ڪريو

سڀني ويوپورٽ سائزن تي فلوٽ نه ڪريو
<div class="float-left">Float left on all viewport sizes</div><br>
<div class="float-right">Float right on all viewport sizes</div><br>
<div class="float-none">Don't float on all viewport sizes</div>

ملائيندڙ

يا Sass mixin ذريعي:

.element {
  @include float-left;
}
.another-element {
  @include float-right;
}
.one-more {
  @include float-none;
}

جوابدار

جوابي تبديليون پڻ موجود آهن هر floatقيمت لاء.

وييو پورٽس تي کاٻي پاسي فلوٽ سائز ايس ايم (ننڍو) يا وسيع

فلوٽ کاٻي پاسي وييو پورٽ جي سائيز جي ايم ڊي (وچولي) يا ويڪر

وييو پورٽس جي سائيز LG (وڏي) يا ويڪر تي کاٻي پاسي فلوٽ

وييو پورٽس جي سائيز XL (اضافي-وڏي) يا وسيع تي کاٻي پاسي فلوٽ

<div class="float-sm-left">Float left on viewports sized SM (small) or wider</div><br>
<div class="float-md-left">Float left on viewports sized MD (medium) or wider</div><br>
<div class="float-lg-left">Float left on viewports sized LG (large) or wider</div><br>
<div class="float-xl-left">Float left on viewports sized XL (extra-large) or wider</div><br>

هتي سڀ سپورٽ طبقا آهن؛

  • .float-left
  • .float-right
  • .float-none
  • .float-sm-left
  • .float-sm-right
  • .float-sm-none
  • .float-md-left
  • .float-md-right
  • .float-md-none
  • .float-lg-left
  • .float-lg-right
  • .float-lg-none
  • .float-xl-left
  • .float-xl-right
  • .float-xl-none