CSS flex Property

ขอให้ทุกรายการที่มีความยืดหยุ่นมีความยาวเดียวกัน regardles ของเนื้อหา:

#main div {
    -webkit-flex: 1; /* Safari 6.1+ */
    -ms-flex: 1; /* IE 10 */
    flex: 1;
}

ความหมายและการใช้งาน

สถานที่ให้บริการดิ้นระบุความยาวของรายการเมื่อเทียบกับส่วนที่เหลือของรายการที่มีความยืดหยุ่นในภาชนะเดียวกัน

สถานที่ให้บริการ Flex เป็นชวเลขสำหรับเติบโตดิ้นดิ้นหดตัวและคุณสมบัติ Flex-พื้นฐานที่

Note: หากองค์ประกอบไม่ได้เป็นรายการที่มีความยืดหยุ่นทรัพย์สินดิ้นไม่มีผล

ค่าเริ่มต้น:	0 1 auto
รับการถ่ายทอด:	no
Animatable:	yes, see individual properties . Read about animatable
เวอร์ชัน:	CSS3
ไวยากรณ์ javascript:	object .style.flex="1" Try it

ตัวเลขในตารางระบุราว์เซอร์รุ่นแรกที่สนับสนุนอย่างเต็มที่ทรัพย์สิน

ตามด้วยหมายเลข -webkit-, -ms- หรือ -moz- ระบุรุ่นแรกที่ทำงานร่วมกับคำนำหน้า

คุณสมบัติ
flex	29.0 21.0 -webkit-	11.0 10.0 -ms-	28.0 18.0 -moz-	9.0 6.1 -webkit-	17.0

flex:flex-growflex-shrinkflex-basis|auto|initial|inherit;

ความคุ้มค่า	ลักษณะ
flex-grow	ระบุจำนวนเท่าใดรายการที่จะเติบโตเมื่อเทียบกับส่วนที่เหลือของรายการที่มีความยืดหยุ่น
flex-shrink	ระบุจำนวนเท่าใดรายการที่จะหดตัวเมื่อเทียบกับส่วนที่เหลือของรายการที่มีความยืดหยุ่น
flex-basis	ความยาวของรายการ ค่าทางกฎหมาย: "auto" , "inherit" หรือหมายเลขตามด้วย "%" , "px" , "em" หรือหน่วยความยาวอื่น ๆ
auto	เช่นเดียวกับ 1 1 อัตโนมัติ
initial	เช่นเดียวกับ 0 1 อัตโนมัติ อ่านเกี่ยวกับการเริ่มต้น
none	เช่นเดียวกับ 0 0 อัตโนมัติ
inherit	สืบทอดคุณสมบัตินี้จากองค์ประกอบหลักของมัน อ่านเกี่ยวกับการรับมรดก

CSS อ้างอิง: flex-basis property

CSS อ้างอิง: flex-direction property

CSS อ้างอิง: flex-flow property

CSS อ้างอิง: flex-grow property

CSS อ้างอิง: flex-shrink property

CSS อ้างอิง: flex-wrap property

อ้างอิง HTML DOM: flex property