คุณสมบัติCSS รายการสไตล์ตำแหน่ง
ตัวอย่าง
ระบุตำแหน่งของตัวทำเครื่องหมายรายการ:
ul.a {
list-style-position: outside;
}
ul.b {
list-style-position: inside;
}
ความหมายและการใช้งาน
คุณสมบัติlist-style-positionระบุตำแหน่งของเครื่องหมายรายการ (bullet points)
list-style-position: outside;หมายความว่าสัญลักษณ์แสดงหัวข้อย่อยจะอยู่นอกรายการ จุดเริ่มต้นของแต่ละบรรทัดของรายการจะถูกจัดแนวในแนวตั้ง:
- กาแฟ - เครื่องดื่มชงจากเมล็ดกาแฟคั่ว...
- ชา
- โคก
list-style-position: inside;หมายความว่าสัญลักษณ์แสดงหัวข้อย่อยจะอยู่ภายในรายการ เนื่องจากเป็นส่วนหนึ่งของรายการ รายการนั้นจะเป็นส่วนหนึ่งของข้อความและกดข้อความในตอนเริ่มต้น:
- กาแฟ - เครื่องดื่มชงจากเมล็ดกาแฟคั่ว...
- ชา
- โคก
| ค่าเริ่มต้น: | ข้างนอก |
|---|---|
| รับการถ่ายทอด: | ใช่ |
| เคลื่อนไหวได้: | ไม่. อ่านเกี่ยวกับแอนิเมชั่น |
| รุ่น: | CSS1 |
| ไวยากรณ์ JavaScript: | วัตถุ .style.listStylePosition="ภายใน" |
รองรับเบราว์เซอร์
ตัวเลขในตารางระบุเบราว์เซอร์รุ่นแรกที่สนับสนุนคุณสมบัติอย่างสมบูรณ์
| Property | |||||
|---|---|---|---|---|---|
| list-style-position | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
ไวยากรณ์ CSS
list-style-position: inside|outside|initial|inherit;
มูลค่าทรัพย์สิน
| Value | Description | Play it |
|---|---|---|
| inside | The bullet points will be inside the list item | |
| outside | The bullet points will be outside the list item. This is default | |
| initial | Sets this property to its default value. Read about initial | |
| inherit | Inherits this property from its parent element. Read about inherit |
หน้าที่เกี่ยวข้อง
กวดวิชา CSS: รายการ CSS
การอ้างอิง CSS: คุณสมบัติรายการสไตล์
การอ้างอิง HTML DOM: คุณสมบัติ listStylePosition