องค์ประกอบ HTML
องค์ประกอบ HTML ถูกกำหนดโดยแท็กเริ่มต้น เนื้อหาบางส่วน และแท็กปิดท้าย
องค์ประกอบ HTML
องค์ประกอบ HTML คือทุกอย่างตั้งแต่แท็กเริ่มต้นจนถึงแท็กสิ้นสุด:
ตัวอย่างขององค์ประกอบ HTML บางส่วน:
| Start tag | Element content | End tag |
|---|---|---|
| <h1> | My First Heading | </h1> |
| <p> | My first paragraph. | </p> |
| <br> | none | none |
หมายเหตุ:องค์ประกอบ HTML บางรายการไม่มีเนื้อหา (เช่น องค์ประกอบ <br>) องค์ประกอบเหล่านี้เรียกว่าองค์ประกอบที่ว่างเปล่า องค์ประกอบที่ว่างเปล่าไม่มีแท็กปิดท้าย!
องค์ประกอบ HTML ที่ซ้อนกัน
องค์ประกอบ HTML สามารถซ้อนกันได้ (ซึ่งหมายความว่าองค์ประกอบสามารถมีองค์ประกอบอื่นๆ ได้)
เอกสาร HTML ทั้งหมดประกอบด้วยองค์ประกอบ HTML ที่ซ้อนกัน
ตัวอย่างต่อไปนี้ประกอบด้วยองค์ประกอบ HTML สี่รายการ ( <html>, <body>, <h1>
และ<p>):
ตัวอย่าง
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
ตัวอย่างที่อธิบาย
องค์ประกอบ<html>เป็นองค์ประกอบรูทและกำหนดเอกสาร HTML ทั้งหมด
มีแท็กเริ่มต้นและแท็ก<html>สิ้นสุด</html>
จากนั้นภายใน<html>องค์ประกอบจะมี<body>
องค์ประกอบ:
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
องค์ประกอบ<body>กำหนดเนื้อหาของเอกสาร
มีแท็กเริ่มต้นและแท็ก<body>สิ้นสุด</body>
จากนั้น ภายใน<body>องค์ประกอบจะมีองค์ประกอบอื่นๆ อีกสององค์ประกอบ:
<h1>และ
<p>:
<h1>My First Heading</h1>
<p>My first paragraph.</p>องค์ประกอบ<h1>กำหนดหัวเรื่อง
มันมีแท็กเริ่มต้น<h1>และแท็กสิ้นสุด</h1>:
<h1>My First Heading</h1>
องค์ประกอบ<p>กำหนดย่อหน้า
มันมีแท็กเริ่มต้น<p>และแท็กสิ้นสุด</p>:
<p>My first paragraph.</p>
ไม่เคยข้ามแท็กสิ้นสุด
องค์ประกอบ HTML บางรายการจะแสดงอย่างถูกต้อง แม้ว่าคุณจะลืมแท็กปิดท้าย:
ตัวอย่าง
<html>
<body>
<p>This is a paragraph
<p>This is a paragraph
</body>
</html>
อย่างไรก็ตามอย่าพึ่งสิ่งนี้! ผลลัพธ์ที่ไม่คาดคิดและข้อผิดพลาดอาจเกิดขึ้นได้หากคุณลืมแท็กปิดท้าย!
องค์ประกอบ HTML ที่ว่างเปล่า
องค์ประกอบ HTML ที่ไม่มีเนื้อหาเรียกว่าองค์ประกอบที่ว่างเปล่า
แท็ ก<br>กำหนดตัวแบ่งบรรทัดและเป็นองค์ประกอบที่ว่างเปล่าโดยไม่มีแท็กปิด:
ตัวอย่าง
<p>This is a <br> paragraph with a line break.</p>
HTML ไม่ใช่ตัวพิมพ์เล็กและตัวพิมพ์ใหญ่
แท็ก HTML ไม่คำนึงถึงขนาดตัวพิมพ์: <P>หมายถึงเหมือนกับ<p>.
มาตรฐาน HTML ไม่ต้องการแท็กตัวพิมพ์เล็ก แต่ W3C แนะนำให้ใช้ตัวพิมพ์เล็กใน HTML และต้องการตัวพิมพ์เล็กสำหรับประเภทเอกสารที่เข้มงวดกว่า เช่น XHTML
ที่ W3Schools เราใช้ชื่อแท็กตัวพิมพ์เล็กเสมอ
การอ้างอิงแท็ก HTML
การอ้างอิงแท็กของ W3Schools มีข้อมูลเพิ่มเติมเกี่ยวกับแท็กเหล่านี้และแอตทริบิวต์
| Tag | Description |
|---|---|
| <html> | Defines the root of an HTML document |
| <body> | Defines the document's body |
| <h1> to <h6> | Defines HTML headings |
สำหรับรายการแท็ก HTML ทั้งหมดที่มีอยู่ โปรดไปที่การอ้างอิงแท็ก HTMLของ เรา