แท็ก <style> ใช้ประกาศสไตล์ชีทภายในส่วนหัว (<head>...</head>) ของเอกสาร HTML เรียกว่า Internal CSS เป็นหนึ่งในวิธีเพิ่ม CSS ใน HTML
<style> ใช้ใน <head> กำหนด CSS สำหรับหน้าเดียว (single page)
ตัวอย่างการใช้ <style>
<!DOCTYPE html> <html>
<head>
<style>
h1 {color: green;}
p {font-size: 14px;}
</style>
</head>
<body>
<h1>Tutorials</h1>
<p>We provide free learning content.</p>
</body>
</html>
เปรียบเทียบ 3 วิธีเพิ่ม CSS
| วิธี | คำอธิบาย | ใช้เมื่อไหร่ |
|---|---|---|
Inline style="..." | เขียนในแท็กโดยตรง | ทดสอบด่วน, unique style ตัวเดียว |
Internal <style> | ใน <head> ของหน้านั้น | หน้าเดียว, ไม่ต้องแชร์ style |
External <link> | ไฟล์ .js แยกต่างหาก | โปรเจกต์จริง, ใช้ซ้ำหลายหน้า, แคชได้ |
แนะนำ: ใช้ External CSS สำหรับโปรเจกต์จริง Internal เหมาะสำหรับหน้าเดี่ยวหรือทดสอบ