Hello guys! Bootstrap merupakan salah satu Framework CSS yang paling terkenal dan sering digunakan. Kali ini kita akan membuat Reordering Classes dalam Bootstrap.
Sumber : Getbootstrap.com
Gunakan kelas .order- untuk mengontrol urutan visual konten Anda. Kelas-kelas ini responsif, sehingga Anda dapat menetapkan urutan berdasarkan breakpoint (contohnya, .order-1.order-md-2). Ini mencakup dukungan untuk angka 1 hingga 12 di semua 5 (Lima) tingkatan grid.
<div class="container"><div class="row"><div class="col">Pertama, tapi tidak berurutan</div><div class="col order-12">Kedua, tapi terakhir</div><div class="col order-1">Ketiga, tapi yang pertama</div></div></div>
Hasil :
Terdapat juga kelas responsif .order-first dan .order-last yang mengubah urutan elemen dengan menerapkan order: -1 dan order: 13 (order: $columns + 1) secara berturut-turut. Kelas-kelas ini juga dapat dicampuradukkan dengan kelas-kelas bernomor .order-* sesuai kebutuhan.
<div class="container"><div class="row"><div class="col order-last">Pertama, tapi terakhir</div><div class="col">Kedua, tapi tidak berurutan</div><div class="col order-first">Ketiga, tapi yang pertama</div></div></div>
Hasil :
Mohon maaf apabila ada kesalahan sedikit pun pada Kode Program ini.
Terima Kasih 😀😊😘👌👍 :)