การจัดตำแหน่งรูปภาพ

รูปแบบคำสั่ง :
      <img src="ชื่อรูปภาพ.นามสกุลภาพ" align ="ตำแหน่ง">
 
คำอธิบาย : align=left หรือ center หรือ Right หรือ top หรือ bottom : เป็นการกำหนดตำแหน่งของรูปว่าจะให้อยู่ด้านซ้าย ขวา หรือ ตรงกลาง ส่วน top กับ bottom ใช้จัดตำแหน่งอักษร เช่น จัดรูปให้อยู่ด้านขวา <img src="surat.jpg" align=right>
ตารางแสดงคำสั่งการจัดตำแหน่งของภาพ
การแสดงผล
คำสั่งที่ใช้กำหนดตำแหน่งข้อความและรูปภาพ
ตำแหน่งที่แสดงผลข้อความและรูปภาพ
1. แบบแนวตั้งเป็นคำสั่งที่ใช้กับรูปภาพ ALIGN = "LEFT" ตำแหน่งซ้ายของจอภาพ
ALIGN = "RIGHT" ตำแหน่งขวาของจอภาพ
2. แบบแนวนอนเป็นคำสั่งที่ใช้กับข้อความ  ALIGN = "TOP","TEXTTOP" ตำแหน่งบนสุดของรูปภาพ
ALIGN = "MIDDLE","ABSMIDDLE" ตำแหน่งกึ่งกลางของรูปภาพ
ALIGN = "BOTTOM","BASELINE","ABSBOTTOM"
ตำแหน่งล่างสุดของรูปภาพ
ตัวอย่างโปรแกรม
<HTML>
<HEAD>
<TITLE> การจัดตำแหน่งภาพ</TITLE>
</HEAD>
<BODY bgcolor=white>
  <p align="left"><img src="computer.jpg" width="200" height="200" align="top">ภาพชิดซ้าย ข้อความนี้อยู่ขอบบนของรูปภาพ</p>
<p>
<hr>
<div align="center"><img src="computer.jpg" width="200" height="200" align="middle"> ภาพอยู่กึ่งกลาง และข้อความอยู่ตรงกลางของรูปภาพ</div>
<hr>
<p><img src="computer.jpg" width="200" height="200" align="bottom">ภาพชิดซ้าย ข้อความอยู่ขอบล่างของรูปภาพ <p>
</BODY>
</HTML>

ผลลัพธ์

ภาพชิดซ้าย ข้อความนี้อยู่ขอบบนของรูปภาพ


ภาพอยู่กึ่งกลาง และข้อความอยู่ตรงกลางของรูปภาพ

ภาพชิดซ้าย ข้อความอยู่ขอบล่างของรูปภาพ