in English
Mengambang
Beralih float pada elemen apa pun, di semua breakpoint, menggunakan utilitas float responsif kami.
Di halaman ini
Ringkasan
Kelas utilitas ini mengapungkan elemen ke kiri atau kanan, atau menonaktifkan mengambang, berdasarkan ukuran area pandang saat ini menggunakan properti CSSfloat
. !important
disertakan untuk menghindari masalah kekhususan. Ini menggunakan breakpoint viewport yang sama dengan sistem grid kami. Perlu diketahui bahwa utilitas float tidak berpengaruh pada item fleksibel.
Mulai mengambang di semua ukuran viewport
Float end pada semua ukuran viewport
Jangan mengapung di semua ukuran viewport
<div class="float-start">Float start on all viewport sizes</div><br>
<div class="float-end">Float end on all viewport sizes</div><br>
<div class="float-none">Don't float on all viewport sizes</div>
Responsif
Variasi responsif juga ada untuk setiap float
nilai.
Float start pada viewport berukuran SM (kecil) atau lebih lebar
Mulai mengambang di area pandang berukuran MD (sedang) atau lebih lebar
Float start pada viewports berukuran LG (besar) atau lebih lebar
Float start pada viewports berukuran XL (ekstra-besar) atau lebih lebar
<div class="float-sm-start">Float start on viewports sized SM (small) or wider</div><br>
<div class="float-md-start">Float start on viewports sized MD (medium) or wider</div><br>
<div class="float-lg-start">Float start on viewports sized LG (large) or wider</div><br>
<div class="float-xl-start">Float start on viewports sized XL (extra-large) or wider</div><br>
Berikut adalah semua kelas dukungan:
.float-start
.float-end
.float-none
.float-sm-start
.float-sm-end
.float-sm-none
.float-md-start
.float-md-end
.float-md-none
.float-lg-start
.float-lg-end
.float-lg-none
.float-xl-start
.float-xl-end
.float-xl-none
.float-xxl-start
.float-xxl-end
.float-xxl-none
Kelancangan
API Utilitas
Utilitas float dideklarasikan di API utilitas kami di scss/_utilities.scss
. Pelajari cara menggunakan API utilitas.
"float": (
responsive: true,
property: float,
values: (
start: left,
end: right,
none: none,
)
),