ความแตกต่างระหว่าง DIV และ SPAN ความแตกต่างระหว่าง

และเป็นแท็ก HTML ที่กำหนดองค์ประกอบในโค้ด HTML

HTML (Hypertext Markup Language) เป็นรหัสที่มีโครงสร้างใช้เพื่อสร้างและแสดงหน้าเว็บที่เราเข้าชมทางออนไลน์ทุกวันบนอุปกรณ์ใดก็ได้

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

เข้าใจ HTML

Hypertext Markup Language

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

ระยะเวลามาร์กอัป หมายถึงข้อความ / รหัสกำลังเตรียมการสำหรับการประมวลผลและการนำเสนอ i. อี บนเว็บเพจในเว็บเบราเซอร์

World Wide Web Consortium (W3C) [i] รู้จัก HTML เป็นภาษามาร์คอัปที่เป็นทางการในการพัฒนาเว็บเพจดังนั้น HTML จึงสนับสนุนโดยเบราว์เซอร์ส่วนใหญ่ ดังนั้นเว็บเพจสามารถพัฒนาได้โดยใช้ภาษาที่เข้าใจได้ง่ายและถูกตีความโดยเบราว์เซอร์ต่างๆเพื่อแสดงผลหน้าเว็บตามที่ผู้ออกแบบกำหนดไว้

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

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

Cascading Style Sheets (CSS)

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

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

เพจ HTML มีโครงสร้างที่องค์ประกอบกำหนด (เรียกอีกอย่างว่าแท็ก) เมื่อเขียนโค้ด HTML องค์ประกอบเหล่านี้จะแสดงเป็นคู่ซึ่งหมายความว่าทุกๆแท็กต้องการการเปิดและปิด เริ่มต้นและสิ้นสุด

องค์ประกอบถูกเปิดด้วยไวยากรณ์:

และปิดด้วย

เส้นเอียงลาด / แสดงถึงจุดสิ้นสุดของนิยามขององค์ประกอบนั้น แอตทริบิวต์และเนื้อหาขององค์ประกอบถูกกำหนดระหว่างจุดสองจุดเหล่านี้

องค์ประกอบขั้นต่ำ

ที่จำเป็นสำหรับไฟล์ HTML คือคำนิยาม, (HTML4 เท่านั้น) และแท็ก คำจำกัดความของ DOCTYPE ต้องนิยามคำจำกัดความ (DTD) เป็นแท็กแรกในไฟล์ HTML ดังนั้นเมื่อประมวลผลหน้าเว็บเว็บเบราว์เซอร์จะรู้ว่าไฟล์ประเภทใดมีอยู่จริงดังนั้นจึงสามารถแปลความหมายได้อย่างถูกต้องและ แสดงเพจ

ใน HTML4 มีรูปแบบต่างๆของ DTD (ขึ้นอยู่กับแอตทริบิวต์และองค์ประกอบของหน้าเว็บ) แต่จะมีข้อความทั่วไปเพิ่มเติมเช่น

หรือ

DTD ใน HTML5 ง่ายกว่ามาก:

HTML, HEAD และ BODY

แท็กระบุว่าเป็นไฟล์ HTML และนี่เป็นรากขององค์ประกอบ HTML ที่มีองค์ประกอบตามมาทั้งหมดที่กำหนดไว้ภายในนั้น และรวมถึงแอตทริบิวต์ภาษาแนะนำเป็นแนวทางปฏิบัติที่ดีที่สุด ตัวอย่างเช่น:

จำเป็นต้องใช้ใน HTML4 แต่ไม่จำเป็นใน HTML5 เป็นองค์ประกอบที่ประกอบด้วยองค์ประกอบอื่น ๆ ที่เกี่ยวข้องกับส่วนของเอกสารนี้เช่นชื่อสคริปต์การอ้างอิงการกำหนดรูปแบบและข้อมูลเมตา ต้องใช้แท็กปิดก่อนที่จะกำหนด

องค์ประกอบจะเก็บเนื้อหาหลักของหน้าเว็บเช่นตารางข้อความรูปภาพรายการเป็นต้นหลังจากปิดแท็กแล้วองค์ประกอบจะสิ้นสุดลง การใช้องค์ประกอบ HTML5 ใหม่เป็นตัวเลือกสำหรับหน้าเว็บหรือในส่วนอื่นของเนื้อหา
องค์ประกอบ HTML
HTML5 ได้สร้างองค์ประกอบใหม่เพื่อความสะดวกในการพัฒนาและออกแบบและได้ลบองค์ประกอบที่ใช้ใน HTML4 แล้ว รายการความแตกต่างระหว่าง HTML4 และ HTML5 เผยแพร่โดย World Wide Web Consortium (W3C) [ii]

HTML DIV TAG

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

แท็กเป็นที่นิยมเมื่อ segregating เนื้อหาบนหน้า เมื่อสร้างองค์ประกอบนี้จะแทรกตัวแบ่ง

โดยอัตโนมัติเพื่อเก็บข้อความหรือเนื้อหาไว้ด้วยกันแทนการใช้ข้อความบนหน้าเว็บ

ด้วยการเข้าถึงเว็บไซต์และการเพิ่มประสิทธิภาพเครื่องมือค้นหาเทคนิคต่างๆได้กลายเป็นวิทยาศาสตร์ที่โดดเด่นและแนะนำโดย WC3 เพื่อไม่ให้กลับไปใช้ HTML5 เสมอไป

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

องค์ประกอบใหม่เหล่านี้สามารถระบุประเภทเนื้อหาโดยใช้ HTML5 ได้อย่างง่ายดาย อย่างไรก็ตามแท็กยังใช้กับ CSS เพื่อสร้างเว็บไซต์ที่ตอบสนองต่อ

การสร้างแต่ละองค์ประกอบ (มี "id หรือชั้นของตนเอง") ไฟล์ CSS สามารถกำหนดเพื่อจัดการกับแต่ละองค์ประกอบได้

ตัวอย่าง HTML ด้านล่างนี้แสดงตัวอย่างการใช้องค์ประกอบหลายอย่าง:

ตัวอย่างของฉัน

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

นี่คือตัวอย่างของวิธีที่แต่ละองค์ประกอบสามารถจัดรูปแบบได้ในไฟล์ CSS ที่เกี่ยวข้องของ HTML โดยอ้างอิงแท็ก

แต่ละอัน

#Header { ความกว้าง: 800px;

ความสูง: อัตโนมัติ

margin-left: auto;

margin-left: auto;

}

#Featured {

ความสูง: 150px;

พื้นหลังสี: #CCC;

HTML SPAN TAG

องค์ประกอบเป็นองค์ประกอบแบบอินไลน์และไม่แบ่งเป็นเส้นยกเว้นแท็กแบ่ง

และข้อความที่กำหนด (เนื้อหา) ระหว่างแท็กเปิดและปิดจะแสดงเป็น บรรทัด (โดยค่าเริ่มต้นโดยไม่ต้องใช้องค์ประกอบอื่น ๆ)

องค์ประกอบแบบอินไลน์เป็นองค์ประกอบข้อความในไฟล์ HTML และสามารถกำหนดได้ภายในบรรทัดขององค์ประกอบอื่น

เช่นเดียวกับองค์ประกอบไม่มี

ความหมาย

สำหรับการอ้างอิงที่ดีที่สุด โดยทั่วไปจะแสดงเนื้อหาของเนื้อหาตามที่เป็นอยู่ แต่สามารถกำหนดอินสแตนซ์ทั้งหมดใน CSS สำหรับจัดแต่งทรงผมหากติดแท็กอย่างถูกต้องและอุดมด้วยคุณลักษณะอื่น ๆ หรือจัดการกับ JavaScript ในตัวอย่างด้านล่างข้อความสีน้ำเงินไฮไลต์ว่าองค์ประกอบของช่วงสามารถซ้อนกันเป็นองค์ประกอบแบบอินไลน์ที่มีแอตทริบิวต์ต่างจากองค์ประกอบหลักได้อย่างไร - ในย่อหน้า p>: เพื่อเปิดตัวอย่างการคลิกที่ไอคอนที่ด้านล่าง ของหน้าเว็บ

เมื่อดูในเว็บเบราเซอร์ข้อความในองค์ประกอบด้านบนจะปรากฏในแบบอักษรอื่นในย่อหน้าเพื่อเน้นว่าผู้ใช้ต้องคลิกเพื่อเข้าถึงตัวอย่าง

หมายเหตุไม่มีความแตกต่างระหว่าง HTML4 และ HTML5