รูปภาพ(Image) และจุดเชื่อมโยง(Link) | ||
ยินดีรับ ผู้สนับสนุน เว็บไซต์ด้านการศึกษา
กลุ่มเว็บไซต์นี้ เริ่มพัฒนา พ.ศ.2542 โดยบุคลากรทางการศึกษาด้านคอมพิวเตอร์ โทร. 081-9927223 (ผมเป็นคนลำปางหนา) ปล. ขอไม่รับ work at home / อาหารเสริม |
รูปภาพ(Image) ด้วย <img src=_____.___> |
|
ตัวอย่างคำสั่ง | ตัวอย่างผลลัพท์ |
<img src=/me/nee.jpg> (ภาพอยู่ใน directory /me) หรือ <img src=nee.jpg> (ภาพอยู่ directory เดียวกับแฟ้ม htm) หรือ <img src="nee.jpg">(เหมือนบรรทัดที่สอง ไม่ใส่ " ก็ได้) <img src=http://www.thaiall.com/me/nee.jpg> (การเรียกภาพจาก internet ถึงไม่ใช่ของเราก็เรียกมาแสดงในเว็บเราได้) |
|
<img src=nee.jpg width=50 height=80> (กำหนดความสูง และความกว้างได้) (แต่ขนาดและเวลาที่ใช้ load ภาพยังเหมือนเดิม) |
|
<img src=mypic00.jpg width=50 height=80> <img src=mypic00.jpg width=60 height=70> <img src=mypic00.jpg width=40 height=90> (แสดงหลาย ๆ ภาพต่อกันไป แต่ไม่ชิดกัน) |
|
<img src=nee.jpg width=50><img src=nee.jpg width=60> (ภาพติดกันเพราะไม่มีช่องไฟ หรือ enter) |
จุดเชื่อมโยง ด้วย <a href=___.htm> ___ </a> |
|
ตัวอย่างคำสั่ง | ตัวอย่างผลลัพท์ |
<a href=htmchr.htm> ตัวอักษรแบบ html </a> (link ไป homepage ใน directory เดียวกับแฟ้ม htm นี้) |
ตัวอักษรแบบ html |
<a href=http://www.yahoo.com>yahoo</a> (link ไป homepage ใน internet ที่ใดก็ได้ นี่เป็นตัวอย่าง yahoo) |
yahoo |
<a href=/me/><img src=/me/nee.jpg></a> (link ภาพไปยัง directory /me หากใน directory มีแฟ้ม index.html) (ก็จะเปิดเว็บ index.html ใน /me อัตโนมัติ ถ้าไม่มีก็จะแสดงชื่อแฟ้มทั้งหมดใน /me) |
|
<a href=/me/ target=_new><img src=/me/nee.jpg border=0></a> (border=0 ทำให้สีรอบภาพหายไป) (target=_new หรือ target=xxyyzz จะเปิดเว็บที่กำหนด ในหน้าต่างใหม่) |
|
<a href=/me/ target=_top><img src=http://www.thaiall.com/indexpic/logota.gif></a> (target=_top ทำให้เปิดในจอเดิม และถ้าอยู่ใน frame ก็จะออกมาแทนที่ frame) (เรื่องของ frame จะอยู่ในบทท้าย ๆ ครับ) |
แบบฝึกหัด |
ให้เขียน homepage โดยทำตามคำสั่งแต่ละข้อต่อไปนี้ ข้อ 1 : ทำการ link yahoo และทดสอบว่า click บนคำว่า yahoo แล้วเปิดหน้าต่างใหม่หรือไม่ ข้อ 2 : ทำหลาย link คนละบรรทัด และต่อกัน สัก 10 link แล้วทดสอบว่าใช้ได้หรือไม่ ข้อ 3 : link logo ของ thaiall(http://www.thaiall.com/indexpic/logota.gif) เมื่อ click logo ให้เปิด thaiall หน้าแรก ข้อ 4 : ไปหา logo ที่เว็บใดสักแห่ง และมาทำเหมือนที่ทำกับข้อ 3 ข้อ 5 : ไปหา logo ที่เว็บใดสักแห่ง แล้ว copy logo มา แล้วให้ทำ link จาก logo ที่ copy มา |