ตัวอย่าง
ตำแหน่งการจัดแนวสำหรับรายการทั้งหมดของความยืดหยุ่น <div> องค์ประกอบที่จุดเริ่มต้นของภาชนะที่:
// Code for Safari 7.0+
document.getElementById("main").style.WebkitAlignItems = "flex-start";
// Standard syntax
document.getElementById("main").style.alignItems =
"flex-start"; ลองตัวเอง» ความหมายและการใช้งาน
สถานที่ให้บริการ alignItems ระบุการจัดตำแหน่งเริ่มต้นสำหรับรายการภายในภาชนะที่มีความยืดหยุ่น
Tip: ใช้สถานที่ให้บริการจัดตัวเองของแต่ละรายการที่จะแทนที่จัดรายการ-ทรัพย์สิน
สนับสนุนเบราว์เซอร์
ตัวเลขในตารางระบุราว์เซอร์รุ่นแรกที่สนับสนุนอย่างเต็มที่ทรัพย์สิน
ตามด้วยหมายเลข Webkit ระบุรุ่นแรกที่ทำงานร่วมกับคำนำหน้า
| คุณสมบัติ | |||||
|---|---|---|---|---|---|
| alignItems | 21.0 | 11.0 | 20.0 | 7.0 Webkit | 12.1 |
หมายเหตุ: Safari สนับสนุนทางเลือกที่ WebkitAlignItems คุณสมบัติ
วากยสัมพันธ์
กลับ alignItems ทรัพย์สิน:
object .style.alignItemsตั้ง alignItems ทรัพย์สิน:
object .style.alignItems="stretch|center|flex-start|flex-end|baseline|initial|inherit"
ค่าทรัพย์สิน
| ความคุ้มค่า | ลักษณะ |
|---|---|
| stretch | ค่าเริ่มต้น. รายการที่จะขยายให้พอดีกับภาชนะ |
| center | รายการที่อยู่ในตำแหน่งที่เป็นศูนย์กลางของภาชนะ |
| flex-start | รายการที่อยู่ในตำแหน่งที่จุดเริ่มต้นของภาชนะ |
| flex-end | รายการที่อยู่ในตำแหน่งที่ส่วนท้ายของภาชนะ |
| baseline | รายการที่อยู่ในตำแหน่งที่ baseline ของภาชนะ |
| initial | ตั้งค่าคุณสมบัตินี้เป็นค่าเริ่มต้น อ่านเกี่ยวกับการเริ่มต้น |
| inherit | สืบทอดคุณสมบัตินี้จากองค์ประกอบหลักของมัน อ่านเกี่ยวกับการรับมรดก |
รายละเอียดทางเทคนิค
| ราคาเริ่มต้น: | ยืด |
|---|---|
| กลับค่า: | สตริงตัวแทนจัดรายการทรัพย์สินขององค์ประกอบ |
| CSS รุ่น | CSS3 |
หน้าเว็บที่เกี่ยวข้อง
อ้างอิง CSS: align-items property
HTML DOM สไตล์อ้างอิง: alignContent property
HTML DOM สไตล์อ้างอิง: alignSelf property
<สไตล์วัตถุ