Penjana Flexbox
Sediakan bekas flex dan itemnya dengan kawalan visual, lihat reka letak bertindak balas secara langsung, dan salin CSS dalam satu klik.
Reka letak anda dibina terus dalam penyemak imbas anda. Tiada apa-apa yang anda tetapkan di sini akan dimuat naik ke BroBroGo.
Soalan Lazim
Apakah perbezaan antara justify-content dan align-items?
Justify-content menjarakkan item di sepanjang paksi utama — arah aliran baris atau lajur — manakala align-items meletakkan item merentasi paksi yang satu lagi. Tukar arah daripada baris kepada lajur dan kedua-dua paksi akan bertukar, jadi justify-content mula berfungsi dari atas ke bawah dan align-items dari kiri ke kanan.
Bagaimanakah kawalan bagi setiap item berfungsi?
Pilih item mengikut nombornya, kemudian tetapkan sejauh mana ia membesar untuk mengisi ruang kosong, sejauh mana ia mengecil apabila ruang sempit, saiz permulaannya (asas) dan jajaran paksi silangnya sendiri. Tertib menggerakkan item lebih awal atau lebih lewat pada skrin tanpa menyentuh HTML. Hanya item yang anda ubah sahaja mendapat peraturan tersendiri dalam CSS.
Bilakah wrap dan align-content menjadi penting?
Dengan pembalutan dimatikan, setiap item dipaksa ke dalam satu baris dan boleh dipersempitkan. Hidupkannya dan item yang tidak lagi muat akan jatuh ke baris seterusnya — ketika itulah align-content mengambil alih, menjarakkan baris sebagai satu kumpulan. Gap menetapkan ruang antara item, dan antara baris, tanpa margin.