ฝัง CSS ใน HTML 5 - นั่นเป็นสิ่งที่ทำ
คุณสามารถรวม CSS ใน HTML 5 ได้อย่างง่ายดาย เพราะถ้าคุณต้องการทำให้เอกสาร HTML และ XML ของคุณน่าดึงดูดยิ่งขึ้น Cascading Style Sheets (CSS) เป็นตัวเลือกที่ดี ภาษาการจัดรูปแบบมีตัวเลือกมากมายให้คุณปรับปรุงเว็บไซต์ของคุณ โดยทั่วไปมีสามวิธีในการรวม CSS เป็น HTML 5 เราจะแสดงให้คุณเห็นในเคล็ดลับการปฏิบัตินี้
CSS ใน HTML 5: ตัวเลือก 1 - ไฟล์ CSS ซอร์ส
ตัวเลือกแรกคือการย้าย CSS ไปยังไฟล์แยกต่างหาก สิ่งนี้มีข้อดีมากมาย: สไตล์ชีตไม่เพียงส่งผลกระทบต่อหน้าเดียวเท่านั้น แต่ยังถูกใช้ในทุก ๆ หน้า HTML5 โดยอัตโนมัติ ข้อได้เปรียบหลักคือการบริหารส่วนกลาง คุณสามารถนำการเปลี่ยนแปลงไปใช้ได้อย่างรวดเร็วในทุกหน้า วิธีฝังไฟล์ CSS ใน HTML 5:
- สร้างไฟล์ CSS ใหม่
- ในส่วนหัวอ้างอิงถึงไฟล์ CSS ของคุณ ในกรณีนี้ไฟล์มีชื่อว่า style.css - แต่การตั้งชื่อนั้นเป็นรายบุคคล:
- คุณควรบันทึกไฟล์ style.css ในไดเรกทอรีหลักของเว็บเซิร์ฟเวอร์
- คุณรวมไฟล์ CSS เข้ากับ HTML 5 เรียบร้อยแล้ว
CSS ที่จุดเริ่มต้นของไฟล์ HTML 5 ของคุณ
หากคุณไม่ต้องการสร้างไฟล์ CSS ภายนอกคุณสามารถตั้งค่าคุณสมบัติ CSS ในส่วนหัวของเอกสาร HTML 5 ของคุณ สิ่งเหล่านี้จะมีผลกับไฟล์ HTML 5 นี้เท่านั้นไม่ใช่สำหรับหน้า HTML 5 ทั้งหมด
- เปิดเอกสาร HTML 5 ของคุณ
- แทรกคำสั่งต่อไปนี้ในพื้นที่ส่วนหัว:
- ตอนนี้กำหนดคุณสมบัติที่ต้องการ: สามารถเป็นได้เช่นขนาดของส่วนหัวสีของข้อความ ฯลฯ ใช้คำสั่ง CSS ที่คุ้นเคยสำหรับสิ่งนี้
- ปิดคำสั่งหลังจากป้อนคุณสมบัติด้วย
- คุณสมบัติที่ระบุถูกนำไปใช้กับเอกสาร HTML 5 นี้
CSS inline style: ใช้คำสั่งโดยตรง
วิธีสุดท้ายในการรวม CSS ใน HTML 5 คือรูปแบบอินไลน์ ซึ่งหมายความว่าคุณป้อนคำสั่งของคุณโดยตรงในซอร์สโค้ด
- ไปที่จุดที่คุณต้องการเปลี่ยนการแสดงผลกราฟิก
- ป้อนคำสั่ง CSS โดยตรง ตัวอย่างเช่นอาจมีลักษณะเช่นนี้:
หัวข้อย่อยสีน้ำเงิน
- คุณสมบัตินี้ใช้สำหรับคำสั่งนี้เท่านั้น