ในการเขียนโค้ด CSS คุณจะต้องใช้โปรแกรมแก้ไขข้อความหรือโปรแกรมแก้ไขโค้ด ตัวเลือกยอดนิยมบางอย่างสําหรับโปรแกรมแก้ไขข้อความ ได้แก่ Notepad (บน Windows) และ TextEdit (บน macOS) ตัวแก้ไขโค้ดเป็นโปรแกรมซอฟต์แวร์พิเศษที่ออกแบบมาโดยเฉพาะสําหรับการเขียนโค้ด และมักจะมีคุณสมบัติต่างๆ เช่น การเน้นไวยากรณ์และการเติมข้อความอัตโนมัติเพื่อให้การเขียนโค้ดง่ายขึ้น
เมื่อคุณตั้งค่าตัวแก้ไขข้อความหรือโค้ดแล้วคุณสามารถเริ่มเขียนโค้ด CSS ได้ CSS ย่อมาจาก Cascading Style Sheets และเป็นภาษาที่ใช้ในการจัดรูปแบบและจัดวางหน้าเว็บ
ในการเขียน CSS คุณจะต้องสร้างไฟล์สไตล์ชีตและเชื่อมโยงไปยังไฟล์ HTML ที่คุณต้องการจัดรูปแบบ นี่คือตัวอย่างพื้นฐานของวิธีการทําเช่นนี้:
1.สร้างแฟ้มข้อความใหม่และบันทึกด้วยนามสกุลแฟ้ม.css นี่จะเป็นสไตล์ชีตของคุณ
2.เพิ่มสไตล์ของคุณลงในไฟล์สไตล์ชีต แต่ละสไตล์ประกอบด้วยตัวเลือกตามด้วยชุดของวงเล็บปีกกาที่มีการประกาศอย่างน้อยหนึ่งรายการ การประกาศประกอบด้วยคุณสมบัติและค่าคั่นด้วยเครื่องหมายทวิภาค เช่น:
body {
background-color: white;
font-family: Arial, sans-serif;
}
h1 {
color: blue;
text-align: center;
}
3.เชื่อมโยงสไตล์ชีตกับไฟล์ HTML ของคุณ ในการดําเนินการนี้คุณจะต้องรวมองค์ประกอบลิงก์ไว้ในส่วนหัวของไฟล์ HTML ของคุณ องค์ประกอบลิงก์ควรมีแอตทริบิวต์ที่มีค่าเป็น “สไตล์ชีต” และแอตทริบิวต์ที่มี URL ของไฟล์สไตล์ชีตของคุณ เช่น:relhref
<head>
<link rel="stylesheet" href="/path/to/styles.css">
</head>
แค่นั้นแหละ! ตอนนี้สไตล์ใด ๆ ที่คุณกําหนดไว้ในสไตล์ชีตของคุณจะถูกนําไปใช้กับองค์ประกอบที่เกี่ยวข้องในไฟล์ HTML ของคุณ
โปรดทราบว่ามีเทคนิคขั้นสูงอีกมากมายที่คุณสามารถใช้เมื่อเขียน CSS เช่น การใช้คลาสและรหัสเพื่อนําสไตล์ไปใช้กับองค์ประกอบเฉพาะ โดยใช้คิวรีสื่อเพื่อสร้างการออกแบบที่ตอบสนอง และการใช้น้ําตกเพื่อควบคุมวิธีการสืบทอดสไตล์ หากต้องการเรียนรู้เพิ่มเติมเกี่ยวกับเทคนิคเหล่านี้คุณสามารถปรึกษาแหล่งข้อมูลเช่น MDN Web Docs หรือหนังสือเกี่ยวกับ CSS