HTML <head> Tag

แท็ก <head> ใน HTML ทำหน้าที่เป็น container สำหรับ elements ต่อไปนี้: <title>, <style>, <base>, <link>, <meta>, <script>, <noscript>

ใน HTML5 คุณสามารถทำงานกับเอกสาร HTML ได้แม้ไม่รวม <head> element

<title> ภายใน <head>

มาดูตัวอย่างการใช้ <head> tag และเพิ่ม <title>:

ตัวอย่าง

<!DOCTYPE html>
<html>
<head>
  <title>Document Title</title>
</head>
<body>
  <h2>Demo Heading</h2>
  <p>This is demo text.</p>
  <p>This is demo text.</p>
  <p>This is demo text.</p>
  <p>This is demo text.</p>
</body>
</html>

จะได้ผลลัพธ์แสดง title ของเอกสารที่เราเพิ่มใต้ <head> element:

<base> ภายใน <head>

แท็ก base ใน HTML ใช้ตั้งค่า base URL สำหรับเอกสาร HTML <head> ทำหน้าที่เป็น container สำหรับ <base> element ด้วย ตัวอย่าง base URL เป็น https://example.com/tutorials สำหรับ relative URLs ทั้งหมด เช่น /html, /java, /jquery ซึ่งจะกลายเป็น:

https://example.com/tutorials/html
https://example.com/tutorials/java
https://example.com/tutorials/jquery

Note — <base> tag ไม่มี end tag ไม่ต้องปิดด้วย </base>

แอตทริบิวต์ดังนี้:

• href — ตั้ง base URL สำหรับ relative URLs ทั้งหมดในหน้า
• target — Default target สำหรับ hyperlinks และ forms ค่าเป็น _blank, _parent, _self, _top และ framename

มาดูตัวอย่างการใช้ <base> element:

ตัวอย่าง

<!DOCTYPE html>
<html>
<head>
  <base href="https://www.example.com/tutorials/">
</head>
<body>
  <h2>Tutotials List</h2>
  <p><a href="java.html">Java Tutorial</a></p><p>(This will act as https://www.example.com/tutorials/java.html)</p>
  <p><a href="jquery.html">jQuery Tutorial</a></p><p>(This will act as https://www.example.com/tutorials/jquery.html)</p>
  <p><a href="blockchain.html">Blockchain Tutorial</a></p><p>(This will act as https://www.example.com/tutorials/blockchain.html)</p>
  <p><a href="python.html">Python Tutorial</a></p><p>(This will act as https://www.example.com/tutorials/python.html)</p>
</body>
</html>

ผลลัพธ์