การวางตำแหน่งสัมพัทธ์เปลี่ยนตำแหน่งขององค์ประกอบ HTML ที่สัมพันธ์กับตำแหน่งที่ปรากฏตามปกติ ดังนั้น "left:20" จะเพิ่ม 20 พิกเซลในตำแหน่ง LEFT ขององค์ประกอบ
คุณสามารถใช้สองค่า top และ ซ้าย พร้อมกับตำแหน่ง คุณสมบัติเพื่อย้ายองค์ประกอบ HTML ไปที่ใดก็ได้ในเอกสาร HTML
- เลื่อนไปทางซ้าย - ใช้ค่าลบสำหรับ left .
- เลื่อนไปทางขวา - ใช้ค่าบวกสำหรับ ซ้าย
- เลื่อนขึ้น - ใช้ค่าลบสำหรับ ด้านบน
- เลื่อนลง - ใช้ค่าบวกสำหรับ ด้านบน
ตัวอย่าง
คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้การจัดตำแหน่งสัมพันธ์ -
<html> <head> </head> <body> <div style = "position:relative;left:80px;top:2px;background-color:yellow;"> This div has relative positioning. </div> </body> </html>
