HTML Elements


HTML Elements

HTML Elements ถูกกำหนดโดยแท็กเริ่มต้น เนื้อหาบางส่วน และแท็กปิดท้าย :

<tagname> เนื้อหา </tagname>

จากตัวอย่าง HTML Element คือ ทุกอย่างตั้งแต่เปิด Tag ไปจนถึงปิด Tag

ตัวอย่างบางส่วนของ HTML Element :

<h1> My First Heading </h1>

<p> My first paragraph. </p>

Tag เปิดเนื้อหา ElementTag ปิด
<h1>My First Heading</h1>
<p>My first paragraph.</p>
<br>ไม่มีไม่มี

หมายเหตุ: HTML Element บางตัวไม่มีเนื้อหา ( เช่น Element <br> ) Element เหล่านี้เรียกว่า Empty Element จะไม่มี Tag ปิดท้าย

HTML Elements ที่ซ้อนกัน

HTML Elements สามารถซ้อนกันได้ (ใน Element สามารถมี Element อื่นๆ ได้)

เอกสาร HTML ทั้งหมดประกอบด้วยองค์ประกอบ HTML ที่ซ้อนกัน

ตัวอย่างต่อไปนี้ประกอบด้วยองค์ประกอบ HTML สี่รายการ ( <html><body><h1> และ <p> ) :

ตัวอย่าง

<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

อธิบายตัวอย่าง

Element <html> เป็นตัวระบุว่าเอกสารเป็น HTML ทั้งหมด

มี Tag เปิด <html> และ Tag ปิด </html>

จากนั้นภายใน Element <html> จะมี Element <body> ซึ่งเนื้อหาจะอยู่ในนี้ :

<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>

Element <body> เป็นส่วนที่บอกถึงเนื้อหาภายในที่จะแสดงผลหน้าเว็บ

โดยจะมี Tag เปิด <body> และ Tag ปิด </body> เสมอ

จากนั้นภายใน Element <body> จะมี Element อื่นอีก 2 Element คือ <h1> และ <p> :

<h1>My First Heading</h1>
<p>My first paragraph.</p>

Element <h1> ส่วนหัวเรื่อง

มี Tag เปิด <h1> และ Tag ปิด </h1> :

<h1>My First Heading</h1>

Element <p> กำหนดข้อความย่อหน้า

มี Tag เปิด <p> และ Tag ปิด </p> :

<p>My first paragraph.</p>

อย่าลืม Tag ปิด

ถึงแม้ว่าการลืมใส่ Tag ปิด จะไม่มีผลต่อการแสดงผลบนหน้าเว็บ แต่ก็ไม่ควรลืมใส่ เพราะหลายครั้งอาจทำให้แสดงผลผิด

<!DOCTYPE html>
<html>
<body> 

<h1>This is header
<p>This is a paragraph.

</body>
</html>

Empty HTML Elements

Element ที่ไม่มีเนื้อหาเราจะเรียกมันว่า Empty Element

เช่น Tag <br> ใช้สำหรับแบ่งบรรทัดเป็น Empty Element ไม่ต้องปิด Tag

ตัวอย่าง

<p>This is a <br> paragraph with a line break.</p>

การพิมพ์ Tag

โดยปกติเราสามารถพิมพ์ Tag ได้ทั้งตัวพิมพ์เล็กและใหญ่ เช่น <p> หรือ <P> แต่บางเอกสารก็จะเคร่งใช้ได้เฉพาะ Tag ที่เป็นตัวพิมพ์เล็ก อย่างเช่น เอกสาร XHTML