Source

Yawo

Juya masu yawo a kan kowane nau'i, ƙetare kowane wuri mai karye, ta amfani da kayan aikin mu masu iyo.

Dubawa

Waɗannan azuzuwan masu amfani suna yawo da wani kashi zuwa hagu ko dama, ko kuma musaki mai iyo, dangane da girman kallon yanzu ta amfani da kadarorin CSSfloat . !importantan haɗa shi don guje wa takamaiman batutuwa. Waɗannan suna amfani da wuraren tsinkewa iri ɗaya kamar tsarin grid ɗin mu. Da fatan za a sani abubuwan amfani da ruwa ba su da tasiri akan abubuwa masu sassauƙa.

Darasi

Juya mai iyo tare da aji:

Yawo a hagu akan duk girman tashar kallo

Yi iyo a kan duk girman wurin kallo

Kar a yi iyo akan duk girman wurin kallo 
<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>

Mixins

Ko ta Sass mixin:

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

Mai amsawa

Hakanan akwai bambancin amsa ga kowace floatƙima.

Yawo a hagu akan madaidaitan ma'aunin SM (kananan) ko fiye

Taso kan ruwa hagu akan girman MD (matsakaici) ko mafi fadi

Yawo a hagu a kan madaidaitan wuraren kallo masu girman LG (manya) ko mafi girma

Taso kan ruwa hagu a kan wuraren kallo masu girman XL (mafi girma) ko fadi 

<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>

Ga duk azuzuwan tallafi;

  • .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