CSS grid-auto-columns 属性

Definisi dan penggunaan

Atribut grid-auto-columns menetapkan saiz baris dalam penampung grid.

Atribut ini hanya mempengaruhi baris yang belum diset saiz.

Lihat juga:

Panduan CSS:Layout Grid CSS

Panduan CSS:Atribut grid-auto-rows

Contoh

Atur saiz lalai baris untuk grid:

.grid-container {
  display: grid;
  grid-auto-columns: 50px;
}

Cuba sendiri

Rumus CSS

grid-auto-columns: auto|max-content|min-content|length;

Nilai atribut

Nilai Penerangan
auto Nilai lalai. Saiz baris ditentukan oleh saiz penampung.
fit-content()
max-content Atur saiz setiap baris berdasarkan objek paling besar di dalam baris.
min-content Atur saiz setiap baris berdasarkan objek paling kecil di dalam baris.
minmax(min.max) Atur julat saiz yang lebih besar atau sama dengan min dan lebih kecil atau sama dengan max.
length Atur saiz baris, melalui penggunaan nilai panjang sah. LihatUnit panjang。
% Atur saiz baris, melalui penggunaan persen.

Detil teknikal

Nilai lalai: auto
Warisan: Tidak
Pembuatan animasi: Didukung. Lihat:Atribut berhubungan dengan animasi。
Versi: Modul Layout Grid CSS Level 1
Rumus JavaScript: object.style.gridAutoColumns="120px"

Pembiayaan pereka

Terdapat nombor di dalam tabel yang menunjukkan versi pereka paling awal yang sepenuhnya mendukung sifat ini.

Chrome IE / Edge Firefox Safari Opera
57 16 52 10 44