การแทรกรูปภาพ

 การแทรกรูปภาพ

ตามปกติภาพที่จะใช้แสดงในเว็บเพจ นิยมใช้ภาพที่มีชื่อสกุลของภาพเป็น .JPG หรือ .GIF เพราะเป็นไฟล์ภาพที่มีขนาดเล็ก สามารถแสดงผลได้รวดเร็ว จึงไม่ต้องเสียเวลาในการรอให้ภาพปรากฏนานเกินไป
 1. ในกรณีที่ไฟล์รูปภาพอยู่ที่เดียวกับเว็บเพจ

Code : <IMG SRC = "ชื่อไฟล์รูปภาพ . นามสกุลไฟล์รูปภาพ">

code ที่เขียนใน notepad คือ

ผลที่แสดงได้คือ

  2.ในกรณีที่ไฟล์รูปภาพอยู่คนละที่กับเว็บ

Code : <IMG SRC = "แฟ้มที่อยู่ของไฟล์รูปภาพ /ชื่อไฟล์ภาพที่เราต้องการแสดง.นามสกุลของภาพ">
code ที่เขียนใน notepa <img src= "img/02.jpg">

ผลที่แสดงได้คือ

การปรับขนาดของภาพ

ในการแทรกภาพเข้าสู่เอกสาร html นั้นขนาดของภาพอาจไม่ตรงตามที่เราต้องการ ซึ่ง html มีคำสั่งสำหรับปรับขนาดภาพโดยนำ width="" height="100" ไปต่อท้ายชื่อภาพภายในคำสั่งแสดงภาพ แล้วปรับขนาดภาพตามต้องการ  ดังตัวอย่าง

<img src="ที่จัดเก็บภาพ\ชื่อภาพ.JPG" width="250" height="350"/>

code ที่เขียนใน notepad คือ

ผลที่แสดงได้คือ

<img src="ที่จัดเก็บภาพ\ชื่อภาพ.JPG" width="700" height="500"/>

code ที่เขียนใน notepad คือ

ผลที่แสดงได้คือ

(1) ALIGN=LEFT กำหนดให้รูปภาพอยู่ทางด้านซ้ายของข้อความ

 <LEFT><IMG SRC="ชื่อภาพ.jpg" ></LEFT>

code ที่เขียนใน notepad คือ

ผลที่แสดงได้คือ

 (2) ALIGN=RIGHT กำหนดให้รูปภาพอยู่กึ่งกลางของข้อความ

<CENTER><IMG SRC="ชื่อภาพ.jpg" ></CENTER>

code ที่เขียนใน notepad คือ

ผลที่แสดงได้คือ

3.ALIGN=RIGHT กำหนดให้รูปภาพอยู่ทางด้านขวาของข้อความ

<P ALIGN =RIGHT><IMG SRC="ชื่อภาพ.jpg" ></ RIGHT>

code ที่เขียนใน notepad คือ

ผลที่แสดงได้คือ

ที่มา

http://www.anut.smfnew.com/index.php?topic=1091.0

http://school.obec.go.th/krurenu/html/p4-2.html

วันที่ 12vกันยายน พ.ศ.2555