15 คำถามและคำตอบแบบทดสอบ CSS

1. คำถาม: CSS ย่อมาจากอะไร?
A. Cascading Style Sheets
B. Computer Style System
C. Creative Style Software
D. Cascading Script System
คำตอบ: A
คำอธิบาย: CSS ย่อมาจาก Cascading Style Sheets ซึ่งเป็นภาษาที่ใช้สำหรับออกแบบและจัดรูปแบบหน้าเว็บ

2. คำถาม: วิธีใดที่ใช้สำหรับใส่ CSS ในเอกสาร HTML ได้?
A. ใช้แท็ก {css}
B. ใช้แท็ก {style} ในส่วน {head}
C. ใช้ไฟล์ .js
D. ใช้แท็ก {script}
คำตอบ: B
คำอธิบาย: สามารถใส่ CSS โดยใช้แท็ก {style} ในส่วน {head} ของเอกสาร HTML เพื่อกำหนดสไตล์ภายใน

3. คำถาม: Selector ประเภทใดที่ใช้สำหรับเลือก element โดยใช้ชื่อคลาส?
A. #id
B. .class
C. element
D. *
คำตอบ: B
คำอธิบาย: Selector .class ใช้สำหรับเลือก element ที่มี class ที่ระบุ เช่น .example จะเลือก element ที่มี class=”example”

4. คำถาม: คุณสมบัติ CSS ใดที่ใช้สำหรับกำหนดสีพื้นหลัง?
A. color
B. background-color
C. font-color
D. text-color
คำตอบ: B
คำอธิบาย: คุณสมบัติ background-color ใช้สำหรับกำหนดสีของพื้นหลังของ element

5. คำถาม: Box model ใน CSS ประกอบด้วยอะไรบ้าง?
A. เฉพาะ margin และ padding
B. Content, padding, border, และ margin
C. เฉพาะ content และ border
D. เฉพาะ padding และ border
คำตอบ: B
คำอธิบาย: Box model ประกอบด้วย content, padding, border, และ margin ซึ่งเป็นโครงสร้างพื้นฐานของ element ใน CSS

6. คำถาม: ค่าอะไรที่ใช้สำหรับกำหนดตำแหน่งของ element ให้อยู่ด้านบนสุดของหน้าจอ?
A. position: static;
B. position: relative;
C. position: fixed;
D. position: absolute;
คำตอบ: C
คำอธิบาย: position: fixed; ทำให้ element อยู่คงที่บนหน้าจอ เช่น เมนูที่ติดอยู่ด้านบน

7. คำถาม: Flexbox ใช้สำหรับอะไร?
A. จัดการเลย์เอาต์แบบตาราง
B. จัดการการจัดวาง element แนวนอนและแนวตั้ง
C. สร้าง animation
D. กำหนดสี
คำตอบ: B
คำอธิบาย: Flexbox เป็นเครื่องมือใน CSS สำหรับจัดการการจัดวาง element ในแนว horizontal และ vertical ได้อย่างยืดหยุ่น

8. คำถาม: Media queries ใช้เพื่ออะไร?
A. กำหนดสไตล์สำหรับขนาดหน้าจอต่างๆ
B. สร้างเอฟเฟกต์ภาพ
C. ใส่รูปภาพ
D. กำหนดฟอนต์
คำตอบ: A
คำอธิบาย: Media queries ใช้สำหรับปรับสไตล์ CSS ตามขนาดหน้าจอ เช่น สำหรับมือถือหรือเดสก์ท็อป

9. คำถาม: คุณสมบัติใดที่ใช้สำหรับเพิ่มการเปลี่ยนแปลงอย่างราบรื่น?
A. animation
B. transition
C. transform
D. opacity
คำตอบ: B
คำอธิบาย: คุณสมบัติ transition ใช้สำหรับสร้างเอฟเฟกต์การเปลี่ยนแปลงที่ราบรื่น เช่น การเปลี่ยนสีเมื่อ hover

10. คำถาม: Pseudo-class ใดที่ใช้สำหรับเลือก element เมื่อมีการชี้เมาส์?
A. :hover
B. :active
C. :focus
D. :visited
คำตอบ: A
คำอธิบาย: :hover เป็น pseudo-class ที่ใช้สำหรับเลือก element เมื่อเมาส์ชี้อยู่เหนือ

11. คำถาม: ความเฉพาะเจาะจง (Specificity) ใน CSS หมายถึงอะไร?
A. ลำดับของไฟล์ CSS
B. น้ำหนักของ selector ในการกำหนดสไตล์
C. ขนาดของ element
D. สีของ element
คำตอบ: B
คำอธิบาย: Specificity หมายถึงระดับความสำคัญของ selector ซึ่งช่วยตัดสินว่า rule CSS ไหนจะถูกนำไปใช้

12. คำถาม: หน่วยใดที่ใช้สำหรับกำหนดขนาดที่ยืดหยุ่น?
A. px
B. em
C. %
D. ทั้ง B และ C
คำตอบ: D
คำอธิบาย: em และ % เป็นหน่วยที่ยืดหยุ่น ขึ้นอยู่กับขนาดของ element แม่หรือหน้าจอ

13. คำถาม: คุณสมบัติใดที่ใช้สำหรับกำหนดฟอนต์?
A. font-family
B. text-size
C. color
D. background
คำตอบ: A
คำอธิบาย: font-family ใช้สำหรับกำหนดประเภทฟอนต์ที่ใช้ใน element

14. คำถาม: วิธีใดที่ใช้สำหรับทำให้รายการ (list) ไม่มีจุด?
A. list-style: none;
B. list-type: hidden;
C. ul: none;
D. display: none;
คำตอบ: A
คำอธิบาย: list-style: none; ใช้สำหรับลบจุดหรือหมายเลขในรายการ ul หรือ ol

15. คำถาม: Responsive design ใน CSS ใช้เพื่ออะไร?
A. ทำให้เว็บไซต์ทำงานเร็วขึ้น
B. ปรับหน้าเว็บให้เข้ากับอุปกรณ์ต่างๆ
C. สร้างกราฟิก
D. กำหนดลิงก์
คำตอบ: B
คำอธิบาย: Responsive design ใช้เทคนิค เช่น media queries เพื่อปรับเลย์เอาต์ให้เหมาะกับขนาดหน้าจอของอุปกรณ์ต่างๆ