Contoh
Membuat beberapa ruang antara item fleksibel <div> elemen:
document.getElementById("main".style.justifyContent = "space-between"; Cobalah sendiri " Definisi dan Penggunaan
Properti justifyContent sejalan item wadah yang fleksibel ketika item tidak menggunakan semua ruang yang tersedia pada main-axis (horizontally) .
Tip: Gunakan properti alignContent untuk menyelaraskan item pada salib sumbu (vertically) .
Dukungan Browser
Properti membenarkan-konten didukung dalam Firefox, Opera, dan Chrome.
Sintaksis
Kembali properti justifyContent:
object .style.justifyContent Mengatur properti justifyContent:
object .style.justifyContent="flex-start|flex-end|center|space-between|space-around|initial|inherit"
Nilai properti
| Nilai | Deskripsi |
|---|---|
| flex-start | nilai default. Produk yang diposisikan pada awal wadah |
| flex-end | Produk yang diposisikan pada akhir wadah |
| center | Produk yang diposisikan di tengah wadah |
| space-between | Produk yang diposisikan dengan ruang antara garis |
| space-around | Produk yang diposisikan dengan ruang sebelumnya, antara, dan setelah garis |
| initial | Set properti ini ke nilai default. Baca tentang awal |
| inherit | Mewarisi properti ini dari elemen induknya. Baca tentang mewarisi |
Rincian teknis
| Nilai default: | flex-start |
|---|---|
| Kembali Nilai: | Sebuah String, yang mewakili properti membenarkan-isi dari sebuah elemen |
| CSS Versi | CSS3 |
Pages terkait
Referensi CSS: justify-content property
HTML DOM STYLE Referensi: alignContent property
HTML DOM STYLE Referensi: alignItems property
HTML DOM STYLE Referensi: alignSelf property
<Style Object