การจัดตำแหน่งเรlatively CSS
- หน้าก่อนหน้า เรื่องย่อเกี่ยวกับ CSS การจัดตำแหน่ง
- หน้าต่อไป การจัดตำแหน่งabsolutely CSS
องค์ประกอบที่จัดตำแหน่งเรlatively จะย้ายไปในระยะทางที่กำหนด องค์ประกอบยังคงทำให้เกิดรูปร่างเดิม และช่องว่างที่มันตั้งแต่เริ่มต้นยังคงอยู่
การจัดตำแหน่งเรlatively CSS
จัดตำแหน่งเรlatively คือความเข้าใจง่ายๆ หลายที่ ถ้าจัดตำแหน่งองค์ประกอบเรlatively มันจะปรากฏขึ้นที่ตำแหน่งที่มันอยู่ หลังจากนั้น สามารถตั้งค่าตำแหน่งตัวนำหรือระยะทางตามทิศทางที่ต้องการเพื่อให้องค์ประกอบเคลื่อนที่
ถ้าตั้งค่า top ให้เป็น 20px แล้ว ตลาดจะมีที่สูงจากด้านบนของตำแหน่งต้นที่ 20 pixel ถ้าตั้งค่า left ให้เป็น 30 pixel จะทำให้มีช่องว่าง 30 pixel ที่ด้านซ้ายขององค์ประกอบ หรือกลับมาที่ด้านขวาขององค์ประกอบ
#box_relative {
position: relative;
left: 30px;
top: 20px;
}
เห็นจากภาพด้านล่าง:
แนะนำว่าในขณะที่ใช้จัดตำแหน่งเรlatively ไม่ว่าจะเคยเคลื่อนที่หรือไม่ องค์ประกอบยังคงทำให้เกิดช่องว่างที่ตั้งแต่เริ่มต้น ดังนั้นการเคลื่อนที่องค์ประกอบจะทำให้เกิดการกันกัน
ตัวอย่างที่ใช้ CSS การจัดตำแหน่งเรlatively
- จัดตำแหน่ง: จัดตำแหน่งเรlatively
- ตัวอย่างนี้แสดงว่าจัดตำแหน่งขององค์ประกอบเรียบเรียงเรlatively ต่อองค์ประกอบที่มีตำแหน่งปกติ
- หน้าก่อนหน้า เรื่องย่อเกี่ยวกับ CSS การจัดตำแหน่ง
- หน้าต่อไป การจัดตำแหน่งabsolutely CSS
