Style flexGrow รายละเอียด

การกำหนดและการใช้งาน

flexGrow คุณสมบัตินี้กำหนดองค์ประกอบจะเพิ่มขึ้นเพียงกี่เท่าเมื่อเทียบกับองค์ประกอบอื่นในตัวแทนองค์ประกอบเดียวกัน:

หมายเหตุ:ถ้าองค์ประกอบไม่ใช่องค์ประกอบเอลาสติก ระบุความเพิ่มขึ้นขององค์ประกอบเมื่อเทียบกับองค์ประกอบอื่นในเครื่องหมายเลขเดียวกันในตัวแทนองค์ประกอบ: flexGrow คุณสมบัติไม่ถูกต้อง

ดูเพิ่มเติม

คู่มือ CSS:flex-grow รายละเอียด

ตัวอย่าง

ทำให้ DIV สีน้ำเงินขยายตัวห้าเท่ากับองค์ประกอบอื่นในการยกเข้าใจที่เป็นเอลาสติก:

document.getElementById("myBlueDiv").style.flexGrow = "5";

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

การใช้งาน

คืนค่า flexGrow รายละเอียด:

object.style.flexGrow

ตั้งค่า flexGrow รายละเอียด:

object.style.flexGrow = "number|initial|inherit"

ค่าของคุณสมบัติ

ค่า รายละเอียด
number ตัวเลข กำหนดความเพิ่มขึ้นขององค์ประกอบเมื่อเทียบกับองค์ประกอบอื่นในการยกเข้าใจที่เป็นเอลาสติก ค่าเริ่มต้นเท่ากับ 0。
initial ตั้งค่าคุณสมบัตินี้เป็นค่าเริ่มต้นของเธอ。โปรดดู initial.
inherit สืบทอดคุณสมบัตินี้จากองค์ประกอบพ่อของเธอ。โปรดดู inherit.

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

ค่าเริ่มต้น: 0
ค่าที่ได้รับมา: ตัวเลขที่แสดงว่าความยาวขององค์ประกอบ flex-grow รายละเอียด.
เวอร์ชั่น CSS: CSS3

การสนับสนุนโปรแกรมบราวเซอร์

ตัวเลขในตารางบอกว่าเวอร์ชั่นบราวเซอร์แรกที่สนับสนุนคุณสมบัตินี้อย่างเต็มที่。

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
สนับสนุน 11.0 สนับสนุน 9.0 สนับสนุน

หน้าที่เกี่ยวข้อง

คู่มือ HTML DOM STYLE:flex รายละเอียด

คู่มือ HTML DOM STYLE:flexBasis รายละเอียด

คู่มือ HTML DOM STYLE:flexDirection รายละเอียด

คู่มือ HTML DOM STYLE:flexFlow รายละเอียด

คู่มือ HTML DOM STYLE:flexShrink รายละเอียด

คู่มือ HTML DOM STYLE:flexWrap รายละเอียด