ตัวอย่าง การจัดวางองค์ประกอบ ด้วย CSS

<div style="border:1px solid black;height:20px;background-color:#FF3333;">
    header
</div>
<div style="float:left; border:1px solid black;width:20%;height:140px;margin-top:5px;background-color:#99CCFF;">
    menu
</div>
<div style="float:right; border:1px solid black;width:79%;height:140px;margin-top:5px;background-color:#CC6633;">
    body
</div>
<div style="border:1px solid black;height:20px;margin-top:150px;background-color:#CC66FF;">
    footer
</div>
                            

คำอธิบาย

border	1px	ขนาดเส้นขอบ
	solid	ประเภทเส้นขอบ
	black	สีเส้นขอบ
width	20%	ความกว่้างของ div
height	140px	ความสูงของ div
margin-top	150px	ระห่างระหว่างเส้นขอบ div
background-color	red	กำหนดสีพื้นหลังให้กับ div

1 - ออกแบบหน้าเว็บไซต์ ให้มี header , menu , body และ footer

ตัวอย่าง

---

header

menu

body

footer

---