ตัวอย่าง
ตั้งขอบด้านบนของตำแหน่งที่แน่นอน <div> องค์ประกอบ 80px ด้านล่างขอบด้านบนของบรรพบุรุษของตนในตำแหน่งที่ใกล้ที่สุด:
div.absolute {
position: absolute;
top: 80px;
width: 200px;
height:
100px;
border: 3px solid #8AC007;
}
ลองตัวเอง» ความหมายและการใช้งาน
สำหรับองค์ประกอบในตำแหน่งอย่างแน่นอนคุณสมบัติด้านบนชุดขอบด้านบนขององค์ประกอบไปยังหน่วยเหนือ / ด้านล่างขอบด้านบนของบรรพบุรุษของตนในตำแหน่งที่ใกล้ที่สุด หมายเหตุ: หากเป็นองค์ประกอบในตำแหน่งที่แน่นอนไม่มีบรรพบุรุษในตำแหน่งที่จะใช้ร่างกายของเอกสารและการเคลื่อนไหวพร้อมกับการเลื่อนหน้า หมายเหตุ: "positioned" องค์ประกอบหนึ่งที่มีตำแหน่งเป็นอะไรยกเว้นแบบคงที่
สำหรับองค์ประกอบในตำแหน่งที่ค่อนข้างที่ให้บริการด้านบนชุดขอบด้านบนขององค์ประกอบไปยังหน่วยเหนือ / ด้านล่างตำแหน่งปกติ
Note: หาก "position:static" สถานที่ให้บริการด้านบนจะไม่มีผล
ค่าเริ่มต้น: | auto |
---|---|
รับการถ่ายทอด: | no |
Animatable: | yes. Read about animatable Try it |
เวอร์ชัน: | CSS2 |
ไวยากรณ์ javascript: | object .style.top="100px" Try it |
สนับสนุนเบราว์เซอร์
ตัวเลขในตารางระบุราว์เซอร์รุ่นแรกที่สนับสนุนอย่างเต็มที่ทรัพย์สิน
คุณสมบัติ | |||||
---|---|---|---|---|---|
top | 1.0 | 5.0 | 1.0 | 1.0 | 6.0 |
CSS ไวยากรณ์
top: auto|length|initial|inherit;
ค่าทรัพย์สิน
ความคุ้มค่า | ลักษณะ | เล่น |
---|---|---|
auto | ช่วยให้เบราว์เซอร์คำนวณตำแหน่งที่ขอบด้านบน นี้จะเริ่มต้น | เล่น " |
length | ตั้งอยู่ในตำแหน่งที่ขอบด้านบนใน PX, ซม., ฯลฯ ค่าลบจะได้รับอนุญาต | เล่น " |
% | ตั้งอยู่ในตำแหน่งที่ขอบด้านบนใน% ของที่มีองค์ประกอบ ค่าลบจะได้รับอนุญาต | เล่น " |
initial | การตั้งค่าคุณสมบัตินี้เป็นค่าเริ่มต้น อ่านเกี่ยวกับการเริ่มต้น | เล่น " |
inherit | สืบทอดคุณสมบัตินี้จากองค์ประกอบหลักของมัน อ่านเกี่ยวกับการรับมรดก |
หน้าเว็บที่เกี่ยวข้อง
CSS Tutorial: ตำแหน่ง CSS
อ้างอิง CSS: bottom property
อ้างอิง CSS: left property
อ้างอิง CSS: right property
อ้างอิง HTML DOM: top property