แท็ก HTML กับองค์ประกอบ HTML คืออะไร?

การออกแบบเว็บเช่นอุตสาหกรรมหรืออาชีพใด ๆ มีภาษาทั้งหมดของตัวเอง ขณะที่คุณเข้าสู่วงการอุตสาหกรรมและเริ่มพูดกับเพื่อนของคุณคุณจะต้องเผชิญกับความวุ่นวายของคำและวลีที่ยังใหม่กับคุณ แต่จะมีผลต่อการทำงานของเว็บมืออาชีพของคุณ คำสองคำที่คุณจะได้ยินคือ "แท็ก" และ "องค์ประกอบ" HTML

ขณะที่คุณได้ยินทั้งสองคำพูดคุณอาจตระหนักว่าพวกเขากำลังถูกใช้สลับกันบ้าง เช่นคำถามหนึ่งที่นักวิชาชีพเว็บหลาย ๆ คนมีเมื่อพวกเขาเริ่มต้นการทำงานกับโค้ด HTML คือ "ความแตกต่างระหว่างแท็ก HTML และองค์ประกอบ HTML คืออะไร"

แม้ว่าทั้งสองคำนี้มีความหมายคล้ายกัน แต่ก็ไม่ใช่คำพ้องความหมายจริงๆ ดังนั้นความคล้ายคลึงกันกับคำศัพท์ทั้งสองนี้มีอะไรบ้าง? คำตอบสั้น ๆ คือทั้งแท็กและองค์ประกอบอ้างอิงถึงมาร์กอัพที่ใช้เขียน HTML ตัวอย่างเช่นคุณอาจบอกว่าคุณกำลังใช้

เพื่อกำหนดย่อหน้าหรือองค์ประกอบเพื่อสร้างลิงก์ หลายคนใช้แท็กข้อกำหนดและองค์ประกอบสลับกันและนักออกแบบเว็บหรือนักพัฒนาซอฟต์แวร์ที่คุณพูดด้วยจะเข้าใจว่าคุณหมายถึงอะไร แต่ในความเป็นจริงมีข้อแตกต่างกันเล็กน้อยระหว่างสองคำนี้

แท็ก HTML

HTML เป็นภาษามาร์คอัปซึ่งหมายความว่ามีการเขียนด้วยรหัสที่สามารถอ่านได้โดยบุคคลโดยไม่จำเป็นต้องได้รับการรวบรวมก่อน กล่าวคือข้อความบนเว็บเพจถูก "ทำเครื่องหมาย" ด้วยรหัสเหล่านี้เพื่อให้คำแนะนำในการแสดงข้อความของเว็บเบราเซอร์ แท็กมาร์กอัปเหล่านี้เป็นแท็ก HTML ด้วยตัวเอง

เมื่อคุณเขียน HTML คุณกำลังเขียนแท็ก HTML แท็ก HTML ทั้งหมดประกอบด้วยส่วนต่างๆดังนี้:

• เครื่องหมายน้อยกว่า

  <

• คำหรืออักขระที่กำหนดว่ากำลังเขียนแท็กใด
• จำนวนของแอตทริบิวต์ HTML ที่เป็นตัวเลือกในรูปแบบ a

  ชื่อ = "ค่า" คู่

• และในที่สุดป้ายที่ใหญ่กว่า

  >

ตัวอย่างเช่นนี่คือบางส่วนแท็ก HTML:

เหล่านี้เป็นแท็กเปิด HTML โดยไม่มีแอตทริบิวต์ที่เป็นตัวเลือกใด ๆ เพิ่มเข้าไป แท็กเหล่านี้แสดงถึง:

• - กำหนดย่อหน้า

• - กำหนดเพจเป็น HTML

• - กำหนดส่วน

ต่อไปนี้เป็นแท็ก HTML:

• 

ตัวอย่างเหล่านี้ทั้งหมดมีแอตทริบิวต์ที่เพิ่มลงในแท็ก HTML ที่เปิดอยู่

• เป็นรายการที่ไม่มีลำดับที่มีแอตทริบิวต์ ID
• ส่วนนี้มีแอตทริบิวต์ class
• anchor หรือ link element มีแอตทริบิวต์ "href"
• แท็กรูปภาพที่มีแอตทริบิวต์ "src"

สำหรับแท็ก anchor และ image แอตทริบิวต์ไม่ได้เป็นตัวเลือกจริงๆพวกเขาจำเป็นต้องมีแท็กเหล่านี้แสดงอย่างถูกต้อง คุณจำเป็นต้องบอกลิงก์ที่จะไป (ซึ่งเป็นสิ่งที่ "href" ไม่) และภาพสิ่งที่จะแสดง (ซึ่งเป็นสิ่งที่แอตทริบิวต์ "src" ให้)

องค์ประกอบ HTML คืออะไร?

ตามข้อกำหนด W3C HTML, a ธาตุ เป็นส่วนสร้างพื้นฐานของ HTML และมักสร้างขึ้นจาก สองแท็ก : แท็กเปิดและแท็กปิด จนถึงตอนนี้เรามองเฉพาะแท็กเปิดซึ่งเริ่มต้นองค์ประกอบต่างๆ เมื่อต้องการสิ้นสุดองค์ประกอบคุณจะต้องเขียนแท็กปิดที่ตรงกัน

ตัวอย่างเช่นสำหรับองค์ประกอบย่อหน้าที่คุณเขียนข้อมูลนี้:

ซึ่งประกอบด้วยแท็กเปิดซึ่งเราเห็นเมื่อไม่นานมานี้รวมทั้งแท็กปิด -

. แท็กปิดจริงๆเพียงแค่แท็กเปิดซ้ำ แต่มี "เครื่องหมายทับ" เพิ่มโดยตรงหลังสัญลักษณ์ "น้อยกว่า"

เกือบทุกองค์ประกอบ HTML มีแท็กเปิดและแท็กปิด แท็กเหล่านี้ล้อมรอบข้อความที่จะแสดงบนหน้าเว็บ ตัวอย่างเช่นในการเขียนย่อหน้าคุณจะต้องเขียนข้อความเพื่อแสดงบนหน้าเว็บและล้อมรอบด้วยแท็กเหล่านี้:

นี่คือที่ที่คุณจะเขียนข้อความของย่อหน้าที่คุณต้องการให้แสดงบนเว็บเพจ

องค์ประกอบ HTML บางส่วนไม่มีแท็กปิด เหล่านี้เรียกว่า "องค์ประกอบที่ว่างเปล่า" บางครั้งพวกเขายังเรียกว่าองค์ประกอบ "singleton" หรือ "โมฆะ" องค์ประกอบที่ว่างเปล่าใช้งานได้ง่ายเพราะคุณต้องใส่แท็กเดียวในหน้าเว็บและเบราเซอร์จะรู้ว่าต้องทำอย่างไร ตัวอย่างเช่นหากต้องการเพิ่มการแบ่งบรรทัดเดี่ยวลงในหน้าเว็บของคุณคุณจะต้องใช้
แท็ก

องค์ประกอบทั่วไปที่มีเฉพาะแท็กเปิดคือองค์ประกอบ "ภาพ" ตัวอย่างเช่น:



เราได้เห็นตัวอย่างนี้ก่อนหน้านี้ แต่ไม่มีแท็กปิดสำหรับองค์ประกอบรูปภาพนี้ เบราเซอร์จะแทนที่โค้ดนี้ด้วยภาพที่อ้างอิงในแอตทริบิวต์ "href" ในกรณีนี้จะเป็น "logo.png"

โดยทั่วไปเมื่อเราอ้างถึงองค์ประกอบหรือแท็ก HTML เราจะใช้คำว่า "element" เพื่อระบุว่าเรากำลังอ้างถึงส่วนต่างๆขององค์ประกอบ (ทั้งแท็กเปิดและปิด) เราใช้เฉพาะ "แท็ก" เมื่อพูดถึงเพียงคนเดียวเท่านั้น นี่คือการใช้คำศัพท์ทั้งสองแบบนี้อย่างถูกต้องและเราสนับสนุนให้คุณใช้พวกเขาอย่างถูกต้อง แต่เพียงรู้ว่าถ้าคุณลื่นและแลกเปลี่ยนความคิดเห็นกับพวกเขาคุณจะเข้าใจการพัฒนาเว็บแบบใหม่ของคุณ