CSS ความขยายของคอลัมน์

คำแนะนำหลักสูตร

คำนิยามและการใช้งาน

column-span ทางภาษา CSS กำหนดองค์ประกอบควรข้ามคอลัมน์เท่าไหร่

ดูเพิ่มเติมCSS3 หลายคอลัมน์

CSS3 ตัวเรียนcolumnSpan ทางภาษา HTML DOM คู่มือ

ตัวอย่าง

ทำให้องค์ประกอบ h2 ข้ามทุกคอลัมน์:

h2
{
column-span:all;
}

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

มีตัวอย่างเพิ่มเติมที่ด้านล่างหน้า

ระบบการเขียน CSS

column-span: 1|all;

ค่าของรายการ

ค่า คำอธิบาย การทดสอบ
1 องค์ประกอบควรข้ามคอลัมน์หนึ่ง การทดสอบ
all องค์ประกอบควรข้ามทุกคอลัมน์ การทดสอบ

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

ค่าเริ่มต้น: 1
ความสืบทอด: no
รุ่น: CSS3
ระบบการเขียนภาษา JavaScript: object.style.columnSpan="all"

ตัวอย่างเพิ่มเติม

Column-count
แบ่งข้อความขององค์ประกอบ div ออกเป็นสามคอลัมน์
Column-gap
แบ่งข้อความขององค์ประกอบ div ออกเป็นสามคอลัมน์ และมีช่องว่างระหว่าง 30 พิกเซล
Column-rule
กำหนดความกว้าง รูปแบบ และสีระหว่างคอลัมน์

การสนับสนุนโปรแกรมนี้

ตัวเลขในตารางระบุรุ่นการเชื่อมต่อแรกที่สนับสนุนคุณสมบัตินี้

ตัวเลขที่มี -webkit- หรือ -moz- แสดงว่าใช้รุ่นแรกที่มีการใช้คำนำหน้า

Chrome IE / Edge Firefox Safari Opera
50.0
4.0 -webkit-
10.0 71.0 9.0
3.1 -webkit-
37.0
15.0 -webkit-
11.1