ใช้ HTML <head> องค์ประกอบ
<head> องค์ประกอบเป็นภาชนะสำหรับข้อมูลเมตา (ข้อมูลเกี่ยวกับข้อมูล)
เมตาดาต้า HTML ที่เป็นข้อมูลเกี่ยวกับเอกสาร HTML เมตาดาต้าจะไม่ปรากฏ
เมตาดาต้ามักจะกำหนดชื่อเอกสารรูปแบบการเชื่อมโยงสคริปต์และข้อมูลเมตาอื่น ๆ
แท็กต่อไปนี้อธิบายเมตา <title>, <style>, <meta>, <link>, <script>, and <base>
ถนัด <html> และ <body> ?
ในมาตรฐาน HTML5 ที่ <html> แท็กที่ <body> แท็กและ <head> แท็กสามารถละเว้น
รหัสต่อไปนี้จะตรวจสอบเป็น HTML5:
ตัวอย่าง
<!DOCTYPE html>
<title>Page Title</title>
<h1>This is a heading</h1>
<p>This is a paragraph.</p> ลองตัวเอง» w3ii ไม่แนะนำให้ถนัด <html> และ <body> แท็ก
<html> องค์ประกอบรากเอกสาร มันเป็นสถานที่ที่แนะนำสำหรับการระบุภาษาหน้า:
<!DOCTYPE html>
<html lang="en-US">ประกาศภาษาเป็นสิ่งสำคัญสำหรับการใช้งานการเข้าถึง (อ่านหน้าจอ) และเครื่องมือค้นหา
ถนัด <html> และ <body> สามารถผิดพลาดไม่ดีเขียน DOM/XML ซอฟแวร์
สุดท้ายถนัด <body> สามารถผลิตข้อผิดพลาดในเบราว์เซอร์รุ่นเก่า (IE9)
ถนัด <head>
ในมาตรฐาน HTML5 ที่ <head> แท็กยังสามารถถูกมองข้าม
โดยค่าเริ่มต้นเบราว์เซอร์จะเพิ่มองค์ประกอบทั้งหมดก่อน <body> เพื่อเริ่มต้น <head> องค์ประกอบ
คุณสามารถลดความซับซ้อนของ HTML โดยถนัด <head> แท็ก:
ตัวอย่าง
<!DOCTYPE html>
<html>
<title>Page Title</title>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html> ลองตัวเอง» ไม่ใส่แท็กคือไม่คุ้นเคยกับนักพัฒนาเว็บ มันต้องใช้เวลาที่จะจัดตั้งขึ้นเป็นแนวทาง
ใช้ HTML <title> ธาตุ
<title> องค์ประกอบที่กำหนดชื่อเรื่องของเอกสาร
<title> องค์ประกอบที่จำเป็นต้องใช้ใน HTML / XHTML เอกสารทั้งหมด
<title> องค์ประกอบ:
- กำหนดชื่อในเบราว์เซอร์แท็บ
- ให้ชื่อหน้าเมื่อมีการเพิ่มในรายการโปรด
- แสดงชื่อหน้าในผลลัพธ์ของเครื่องมือค้นหา
เอกสาร HTML ที่เรียบง่าย:
ตัวอย่าง
<!DOCTYPE html>
<html>
<title>Page Title</title>
<body>
The content of the document......
</body>
</html> ลองตัวเอง» ใช้ HTML <style> องค์ประกอบ
<style> องค์ประกอบที่จะใช้ในการกำหนดข้อมูลสไตล์สำหรับเอกสาร HTML
ภายใน <style> องค์ประกอบที่คุณระบุว่าองค์ประกอบ HTML ควรแสดงผลในเบราว์เซอร์:
ใช้ HTML <link> ธาตุ
<link> องค์ประกอบที่กำหนดความสัมพันธ์หน้าไปยังแหล่งข้อมูลภายนอก
<link> องค์ประกอบส่วนใหญ่มักจะใช้ในการเชื่อมโยงไปยังแผ่นสไตล์:
ใช้ HTML <meta> ธาตุ
<meta> องค์ประกอบที่จะใช้ในการระบุรายละเอียดหน้าคำหลักผู้เขียนและข้อมูลอื่น ๆ
เมตาดาต้าจะใช้เบราว์เซอร์ (how to display content) โดยเครื่องมือค้นหา (keywords) และบริการเว็บอื่น ๆ
กำหนดคำหลักสำหรับเครื่องมือค้นหา:
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">กำหนดรายละเอียดของหน้าเว็บของคุณ:
<meta name="description" content="Free Web tutorials on HTML and CSS">กำหนดชุดตัวอักษรที่ใช้:
<meta charset="UTF-8">กำหนดผู้เขียนหน้า:
<meta name="author" content="Hege Refsnes">รีเฟรชเอกสารทุก 30 วินาที:
<meta http-equiv="refresh" content="30">ตัวอย่างของการ <meta> แท็ก:
ตัวอย่าง
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML,CSS,XML,JavaScript">
<meta name="author" content="Hege Refsnes">
<meta charset="UTF-8"> ลองตัวเอง» ใช้ HTML <script> ธาตุ
<script> องค์ประกอบที่จะใช้ในการกำหนด JavaScripts ฝั่งไคลเอ็นต์
สคริปต์ด้านล่างเขียนสวัสดี JavaScript! เป็นองค์ประกอบ HTML กับ id="demo" :
ตัวอย่าง
<script>
function myFunction {
document.getElementById("demo").innerHTML = "Hello JavaScript!";
}
</script> ลองตัวเอง» เรียนรู้เกี่ยวกับ JavaScript, เยี่ยมชม การสอน JavaScript !
ใช้ HTML <base> ธาตุ
<base> องค์ประกอบที่ระบุ URL ฐานและเป้าหมายฐานสำหรับ URL ญาติทั้งหมดในหน้าเว็บ:
องค์ประกอบหัว HTML
| แท็ก | ลักษณะ |
|---|---|
| <head> | กำหนดข้อมูลเกี่ยวกับเอกสาร |
| <title> | กำหนดชื่อเรื่องของเอกสาร |
| <base> | กำหนดที่อยู่เริ่มต้นหรือเป้าหมายเริ่มต้นสำหรับการเชื่อมโยงทั้งหมดบนหน้าเว็บ |
| <link> | กำหนดความสัมพันธ์ระหว่างเอกสารและทรัพยากรภายนอก |
| <meta> | กำหนดข้อมูลเมตาเกี่ยวกับเอกสาร HTML |
| <script> | กำหนดสคริปต์ฝั่งไคลเอ็นต์ |
| <style> | กำหนดข้อมูลสำหรับรูปแบบเอกสาร |