ใน HTML อันดับแรกคุณเขียนคำจากนั้นเพิ่มองค์ประกอบหรือแท็กลงไปซึ่งจะปรากฏบนหน้าเว็บของคุณ ด้วยวิธีนี้เบราว์เซอร์จะรู้หัวข้อของหน้าเริ่มต้นและสิ้นสุดของย่อหน้าและอื่น ๆ
ใน CSS กฎจะถูกใช้โดยการใช้คุณสมบัติ CSS โดยทั่วไปคุณสมบัติ CSS นั้นแบ่งออกเป็นสองประเภทกว้าง ๆ แรกคืองานนำเสนอที่ระบุสีของข้อความประเภทตัวอักษรขนาดตัวอักษรสีพื้นหลังภาพพื้นหลังและอื่น ๆ ที่สองคือเค้าโครงกำหนดตำแหน่งขององค์ประกอบที่แตกต่างกันบนหน้าจอ
ใช้ทั้ง HTML และ CSS มีการสร้างส่วนต่อประสานหน้าเว็บที่สมบูรณ์
แผนภูมิเปรียบเทียบ
| พื้นฐานสำหรับการเปรียบเทียบ | HTML | CSS |
|---|---|---|
| ขั้นพื้นฐาน | กำหนดเนื้อหาและโครงสร้างของหน้าเว็บ | ปรับเปลี่ยนการออกแบบและการแสดงองค์ประกอบ HTML |
| ความสัมพันธ์กัน | CSS สามารถใช้ในไฟล์ HTML | ไม่สามารถใช้ HTML ในสไตล์ชีท CSS |
| ประกอบด้วย | แท็กเนื้อหาโดยรอบ | ตัวเลือกประสบความสำเร็จโดยบล็อกการประกาศ |
| วิธีการใช้ | ไม่มีวิธีการที่กำหนดไว้ | โค้ด CSS แบบอินไลน์สไตล์ชีตภายในและภายนอกสามารถใช้วิธีการใดก็ได้ในการติดตั้งโค้ด |
ความหมายของ HTML
HTML เป็นภาษามาร์กอัปสำหรับการกำหนดเอกสารเว็บ (หน้าเว็บ) HTML ขยายออกเป็น ภาษาของ Hyper Text Markup ซึ่งจะเพิ่ม“ มาร์กอัป ” เป็นข้อความภาษาอังกฤษมาตรฐาน “ ไฮเปอร์เท็กซ์ ” หมายถึงลิงค์ - ลิงค์ไฮเปอร์ - ที่เชื่อมโยงหน้าเว็บเข้าด้วยกัน
ภาษามาร์กอัปเป็นกลุ่มของแท็กมาร์กอัปที่กำหนดโครงสร้างหน้า แต่ละแท็ก HTML อธิบายเนื้อหาเอกสารที่แตกต่างกัน HTML กำลังเติบโตภาษาซึ่งมีการเปลี่ยนแปลงบ่อยครั้งและกลุ่มมาตรฐานและข้อมูลจำเพาะที่ได้รับการแก้ไขได้รับอนุญาตให้สร้างไซต์ที่น่าดึงดูดและใช้งานได้ง่ายขึ้น
HTML ไม่คำนึงถึงขนาดตัวพิมพ์
ตัวอย่าง:
- แท็ก HTML เป็นคำหลักพื้นฐาน (ชื่อแท็ก) ซึ่งอยู่ในวงเล็บเหลี่ยมและมักมาเป็นคู่
เนื้อหา
- องค์ประกอบ HTML อธิบายส่วนเฉพาะบนหน้าเว็บ
- เนื้อหา คือข้อความลิงค์รูปภาพหรือข้อมูลอื่น ๆ ที่แสดงบนหน้าเว็บของคุณ
- แท็ก เริ่ม คือองค์ประกอบ HTML ที่ใช้เพื่อระบุจุดเริ่มต้นขององค์ประกอบ
- แท็ก ปิด ท้าย จะปิดองค์ประกอบ HTML เพื่อแยกความแตกต่างของแต่ละองค์ประกอบ
คำจำกัดความของ CSS
CSS เป็นตัวย่อสำหรับ Cascading Style Sheets ซึ่ง อนุญาตให้คุณสร้างกฎที่ระบุการแสดงองค์ประกอบ HTML บนหน้าจอ มันเป็นส่วนเพิ่มเติมของ HTML พื้นฐานที่เปิดใช้งานการกำหนดสไตล์ให้กับหน้าเว็บของคุณ
CSS ช่วยประหยัดงานได้มากโดยการควบคุมเลย์เอาต์ของเว็บเพจหลาย ๆ หน้าพร้อมกัน CSS สไตล์สามารถนำมาใช้ในสามวิธีที่แตกต่างไปยังเว็บไซต์ของคุณ: อินไลน์ สไตล์ ภายใน และ ภายนอก
ตัวอย่าง:
- การประกาศ CSS จะอยู่ภายในวงเล็บปีกกาและแต่ละส่วนประกอบด้วยสองส่วน: คุณสมบัติ และ ค่า ของมันคั่นด้วยเครื่องหมายโคลอน คุณสามารถกำหนดคุณสมบัติได้มากมายในการประกาศเดียวโดยแต่ละรายการคั่นด้วยเซมิโคลอน
- Selectors ระบุองค์ประกอบ HTML ที่คุณต้องการกำหนดสไตล์
- การประกาศ มีคุณสมบัติและค่าคั่นด้วยเครื่องหมายโคลอน นอกจากนี้วงเล็บปีกกาที่ล้อมรอบการประกาศทั้งหมดเรียก ว่า บล็อกการ ประกาศ
- คุณสมบัติ หมายถึงองค์ประกอบขององค์ประกอบที่คุณต้องการเปลี่ยนแปลง
- ค่า ระบุการตั้งค่าที่คุณต้องการนำไปใช้ในคุณสมบัติที่เลือก
ความแตกต่างที่สำคัญระหว่าง HTML และ CSS
- HTML เป็นภาษามาร์กอัปพื้นฐานซึ่งอธิบายเนื้อหาและโครงสร้างของหน้าเว็บ ในทางกลับกัน CSS เป็นส่วนเสริมของ HTML ที่ปรับเปลี่ยนการออกแบบและการแสดงผลของหน้าเว็บ
- ไฟล์ HTML สามารถมีโค้ด CSS ในขณะที่สไตล์ชีท CSS จะไม่มีโค้ด HTML อยู่
- HTML ประกอบด้วย แท็ก โดยรอบเนื้อหา แต่ทว่า CSS ประกอบด้วย ตัวเลือกที่ ประสบความสำเร็จโดย บล็อก การประกาศ
ข้อดีของ HTML
- ใช้งานง่ายและมีไวยากรณ์หลวม (แม้ว่าความยืดหยุ่นเกินไปจะไม่เป็นไปตามมาตรฐาน)
- ใช้กันอย่างแพร่หลายสร้างขึ้นในเกือบทุกเว็บไซต์และรองรับโดยทุกเบราว์เซอร์
- คล้ายกับไวยากรณ์ XML ซึ่งใช้ในระดับที่เพิ่มขึ้นสำหรับการจัดเก็บข้อมูล
- ฟรีที่คุณไม่จำเป็นต้องซื้อซอฟต์แวร์ใด ๆ
- ง่ายต่อการเรียนรู้และรหัสแม้กระทั่งผู้เริ่มต้น
ข้อดีของ CSS
- CSS อนุรักษ์เวลาของคุณโดยการเขียน CSS ครั้งเดียวและใช้ชีตเดียวกันซ้ำในหลาย ๆ หน้า
- หน้าใช้เวลาในการโหลดน้อยลงเนื่องจากมีรหัสน้อยลง
- ดูแลรักษาง่ายการเปลี่ยนแปลงระดับโลกใช้งานง่าย
- CSS มีสไตล์ที่ดีกว่าสำหรับ HTML และมีคุณสมบัติที่กว้างกว่ามาก
- การจัดหาความเข้ากันได้ของอุปกรณ์หลายอย่าง
- ตอนนี้แอตทริบิวต์ HTML กำลังถูกลดทอนลงและแนะนำให้ใช้ CSS ในหน้า HTML ทั้งหมดเพื่อให้เข้ากันได้กับเบราว์เซอร์ในอนาคต
- รองรับการเรียกดูออฟไลน์ด้วยความช่วยเหลือของแคชออฟไลน์
- สคริปต์ให้ความเป็นอิสระของแพลตฟอร์มถาวรและสามารถรองรับเบราว์เซอร์ล่าสุดได้เช่นกัน
ข้อเสียของ HTML
- เนื่องจากเป็นภาษาแบบสแตติกจึงไม่สามารถสร้างเอาต์พุตแบบไดนามิกได้
- มีคุณสมบัติความปลอดภัยที่ จำกัด
ข้อเสียของ CSS
Fragmentation - CSS สร้างมิติที่แตกต่างกันสำหรับแต่ละเบราว์เซอร์ โปรแกรมเมอร์ควรพิจารณาและทดสอบรหัสทั้งหมดในเบราว์เซอร์หลาย ๆ ตัวก่อนที่จะเข้าเว็บไซต์ใด ๆ หรือแอปพลิเคชั่นมือถือทำงานได้เพื่อไม่ให้เกิดปัญหาความเข้ากันได้
สรุป:
HTML และ CSS ทั้งสองภาษาสคริปต์ฝั่งไคลเอ็นต์ใช้สำหรับสร้างหน้าเว็บ แม้ว่ามันจะมีความแตกต่างกันในหลาย ๆ อย่างเช่นโครงสร้างการสร้างประโยควิธีการใช้งานความง่ายในการใช้งานและฟีเจอร์ต่าง ๆ เช่นคุณสมบัติที่รองรับโดยภาษา อย่างไรก็ตาม CSS กำลังแทนที่ HTML เนื่องจากมีคุณสมบัติและความยืดหยุ่นมากกว่า
