สร้างเมนูในเว็บไซต์

หลักการเดียวกันกับบทความที่แล้ว คือเราจะยังใช้แท็ก <a> นั่นเอง มาดูวิธีการสร้างเมนูง่าย ๆ กัน

สมมติเรามีไฟล์ HTML อยู่ 2 ไฟล์ ประกอบด้วย
1.ไฟล์ index.html คือหน้าหลัก
2.ไฟล์ contact.html คือข้อมูลที่เกี่ยวกับการติดต่อ
ทั้ง 2 ไฟล์จะต้องอยู่ใน Folder เดียวกัน

เราจะต้องสร้างเมนูขึ้นมาเพื่อลิงก์จากหน้า index.html ไปยังหน้า contact.html เขียนโค้ดได้ดังนี้

หน้า index.html

<!DOCTYPE html>
<html>
<body>
<h4>เมนู</h4>
<a href="index.html">หน้าหลัก</a>
<a href="contact.html">ติดต่อเรา</a>
<hr>
<p>นี่คือหน้าหลัก</p>
</body>
</html>

ดูผลลัพธ์

หน้า contact.html

<!DOCTYPE html>
<html>
<body>
<h4>เมนู</h4>
<a href="index.html">หน้าหลัก</a>
<a href="contact.html">ติดต่อเรา</a>
<hr>
<p>นี่คือหน้าติดต่อเรา</p>
</body>
</html>

ดูผลลัพธ์

อธิบายเพิ่มเติม เมื่อมีการคลิกที่เมนูหน้าหลัก ก็จะลิงก์ไปยังหน้า index.html และเมื่อคลิกเมนูติดต่อเรา ก็จะลิงก์ไปยังหน้า contact.html