top of page

5.3 การกำหนดขนาดของรูปภาพ

โดยปกติเมื่อเราใส่รูปภาพลงในเว็บเพจ รูปภาพนั้นจะเเสดงด้วยขนาดตามรูป

รูปแบบ

<img src ="ชื่อไฟล์รูป"width="ความกว้าง"้height="ความสูง"

โดยที่

width  ใช่กำหนดความกว้างของรูป

height  ใช่กำหนดความสูงของรูปภาพ

โดยการกำหนดขนาดนี้ จะกระทำได้ 2 แบบคือ

1. กำหนดแบบคงที่  โดยกำหนดเป็นจำนวนพิกเซล ซึ่งรูปภาพจะเเสดงตามขนาดที่กำหนด

2. กำหนดเเบบรอยตัว โดยกำหนดเป็น % ของขนาดของหน้าต่างเบราว์ดซอร์ขณะนั้นซึ่งเมื่อมีการปรับขนาดหน้าต่างเบราว์เซอร์ ณุปภ่าพนั้นจะถูกปรับขนาดตาม

ตัวอย่างการปรับขนาดรูปภาพ

<!Doctype html>

 <html>

 <head>

 <title>Image Tag </title>

 </head>

 <body>

        <img src ="comp.jpg"

        <img src ="comp.jpg"width="100"hight="180">

        <img src ="comp.jpg"width="30%">

 </body>

 </html>

maxresdefault.jpg
bottom of page