Position Relative กับการจัดตำแหน่งของ DIV CSS
บทความวันที่ 18 ธันวาคม 2555
Position Relative คือ Attribute ในการจัดตำแหน่งของ CSS โดยมีคุณสมบัติคือ จะทำการจัดตำแหน่งโดยอิงจาก DIV ที่ห่อหุ้มตัวมันอยู่
ภาพรวมของ Position Relative
1. ใช้สำหรับการจัดตำแหน่งของ DIV ที่ต้องการ
2. ใช้รวมกับคำสั่ง left, right, top, bottom สำหรับการเคลื่อนตำแหน่งไปในทิศทางต่าง ๆ
ตัวอย่างโปรแกรม
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>amplysoft.com</title></head><body><style type="text/css">#div1 { float:left; width:100px; height:100px; border:solid 2px red; text-align:center;}#div2 { float:left; width:65px; height:50px; border:solid 2px green; text-align:center; position:relative; top:10px; left:10px;}</style><div id='div1'><div id='div2'>top:10px<br/>left:10px</div></div></body></html> |
ผลลัพธ์
