CSS กฎคอลัมน์ grid

การระบุและการใช้งาน

อาตริย์ grid-auto-columns ตั้งขนาดของคอลัมน์ในตัวเครื่องเรียกแบบแนวเส้นนวน。

อาตริย์นี้จะส่งผลกระทบต่อคอลัมน์ที่ยังไม่ถูกตั้งขนาด。

ดูเพิ่มเติม：

ตำรา CSS:CSS Grid Layout

คู่มือ CSS:อาตริย์ grid-auto-rows

ตัวอย่าง

ตั้งขนาดคอลัมน์เริ่มต้นของเกาะตามตาราง:

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

ทดลองด้วยตัวเอง

เนื้อหา CSS:

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

ค่าของอาตริย์

ค่า คำอธิบาย
auto ค่าเริ่มต้น
fit-content()
max-content ตั้งขนาดของคอลัมน์ตามขนาดขององค์ประกอบที่ใหญ่ที่สุดในคอลัมน์。
min-content ตั้งขนาดของคอลัมน์ตามขนาดขององค์ประกอบที่เล็กที่สุดในคอลัมน์。
minmax(min.max) ตั้งขนาดที่ใหญ่หรือเท่ากับ min และเล็กกว่าหรือเท่ากับ max。
length ตั้งขนาดของคอลัมน์โดยใช้ค่าขนาดที่ถูกต้อง。หน่วยขนาด。
% ตั้งขนาดของคอลัมน์โดยใช้ร้อยละค่า。

รายละเอียดเทคนิค

ค่าเริ่มต้น auto
มีความถูกต้องตามปกติ ไม่
การสร้างอนุภาค สนับสนุน。ดูข้อมูลเพิ่มเติม：คุณสมบัติที่เกี่ยวกับอนุภาค。
เวอร์ชั่น： CSS Grid Layout Module Level 1
เนื้อหา JavaScript: object.style.gridAutoColumns="120px"

การสนับสนุนบราวเซอร์

ตารางจำแนกค่าระบุตัวเครื่องเรียกความสามารถของบราวเซอร์แรกที่สนับสนุนคุณสมบัตินี้อย่างเต็มที่。

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