จากบทที่แล้ว เราได้เข้าใจเกี่ยวกับ การกำหนดคุณสมบัติ ตัวอักษร การกำหนดลักษณะ ตัวอักษร Font ในลักษณะต่างๆ กันไปแล้ว สิ่งหนึ่งที่สำคัญก็คือ การเชื่อมโยงหน้าเว็บ Hyperlink ครับ เพราะเอกสารหรือข้อมูลที่เป็นเว็บเพจ Web Page นั้น จุดเด่น คือ ความสามารถในการเชื่องโยงหน้าเว็บ หรือหน้าเอกสารนั่นเองครับ
1.สร้าง hyperlink
ในตัวอย่างจะใช้ตัวอักษรในการทำ hyperlink ซึ่งการลิงค์ในตัวอย่างจะมี 2 แบบคือ
1.1. ลิงค์ภายในเว็บไซต์ด้วยกัน มีหลักการสร้าง hyperlink ดังรูปด้านล่าง
รูปแบบของ hyperlink ภายใน directory เดียวกัน
<a href="http://www.blogger.com/ชื่อไฟล์ที่ต้องการลิงค์%22%3Eตัวอักษรที่จะใช้แสดง </a>
รูปแบบของ hyperlink จาก directory ที่สูงกว่า
<a href="http://www.blogger.com/ชื่อ%20directory%20ที่เก็บไฟล์ไว้/ชื่อไฟล์ที่ต้องการลิงค์%22%3Eตัวอักษรที่จะใช้แสดง </a>
รูปแบบของ hyperlink จาก directory ที่ต่ำกว่า 1 ขั้น
<a href="http://www.blogger.com/ชื่อไฟล์ที่ต้องการลิงค์%22%3Eตัวอักษรที่จะใช้แสดง </a>
1.2. ลิงค์กับเว็บภายนอก
รูปแบบของ hyperlink กับเว็บภายนอก
<a href="http://domain%20name/%22%3Eตัวอักษรที่จะใช้แสดง </a>
2.สร้าง hyperlink ด้วยรูปภาพ
ในตัวอย่างจะเป็นการสร้างลิงค์ด้วยรูปภาพ
รูปแบบของการสร้าง hyperlink ด้วยรูปภาพ
3.สร้าง hyperlink ในหน้าเดียวกัน
ในหน้าที่มีบทความเยอะมากๆ เราต้องการสร้าง link เพื่อไปยังหัวข้อที่อยู่ในหน้าเดียวกันเพื่อความสะดวกในการอ่านบทความ โดยเราจะตั้งจุดที่เราต้องการจะ link ไปหาโดยใช้ <a href="http://www.blogger.com/" name="ชื่อ"></a>
รูปแบบของการสร้าง hyperlink ในหน้าเดียวกัน
สร้างจุดที่ต้องการจะลิงค์ไป
<a href="http://www.blogger.com/" name="ชื่อจุดลิงค์"></a>
สร้างลิงค์
<a href="http://www.blogger.com/page-edit.g?blogID=9128346520675202329&pageID=957151222851709709#ชื่อจุดลิงค์">ตัวอักษรที่ต้องการแสดง </a>
4.เปิด browser ใหม่เมื่อคลิกที่ลิงค์
การสร้าง link ให้เปิด browser ใหม่เราจะใช้ Attributes โดยพิมพ์ target="_blank" ใน a tag
เปิด browser ใหม่เมื่อคลิกที่ลิงค์
<a href="http://www.blogger.com/เป้าหมาย" target="_blank">ตัวอักษรที่ใช้แสดง</a>