ปัญหาอย่างหนึ่งสำหรับผู้ที่เพิ่งหัดเขียน css ใหม่ก็คือ ไม่รู้ว่าเมื่อไหร่ควรจะเลือกใช้ ID และเมื่อไหร่ถึงสมควรจะเลือกใช้ Class
ก่อนอื่นเราต้องมาดูกันว่า ID และ Class แตกต่างกันอย่างไร
1.วิธีเขียนที่แตกต่างกัน
การเขียน ID ใน CSS จะเริ่มต้นด้วยสัญญลักษณ์ # แล้วตามด้วยชื่อ ID ที่เราต้องการตั้ง เช่น
#main_header
#main_menu
#sub_menu
#footer
การเขียน Class ใน CSS จะเริ่มต้นด้วยสัญญลักษณ์ . แล้วตามด้วยชื่อ Class ที่เราต้องการตั้ง เช่น
.sub_header
.main_list
.content
.details
2.จำนวนครั้งที่ใช้ได้ต่อหน้าเว็บ
ID ที่ตั้งขึ้นมาจะอนุญาตให้ใช้ได้ครั้งเดียวในหน้า และหนึ่งแท็กจะใส่ ID ได้ตัวเดียว ส่วน Class ที่ตั้งขึ้นมาจะอนุญาตให้ใช้ได้หลายครั้งในหน้าเดียวกัน และหนึ่งแท็กจะใส่ Class ได้หลายตัว
เราควรเลือกใช้ ID หรือ Class ในกรณีใดบ้าง
เราควรเลือกใช้ ID เมื่อเราต้องการระบุถึงส่วนสำคัญของหน้าที่ในหน้าหนึ่งๆจะมีแค่หนึ่งเดียวเท่านั้น เช่น ส่วนหัวด้านบนของหน้า, ส่วนเมนูหลักของหน้า, ส่วนเนื้อหาของหน้า หรือส่วนท้ายสุดที่ประกอบในหน้า หรือเลือกใช้ ID ในส่วนที่เราต้องการใส่ JavaScript หรือ jQuery เพื่อเพิ่มลูกเล่นและความสวยงามให้กับหน้า
เราควรเลือกใช้ Class เมื่อเราต้องการใส่สไตล์การแสดงผลที่เป็นรายละเอียดปลีกย่อยที่เราอยากใช้ร่วมกันได้กับหลายๆแท็กในหน้าเดียวกัน เช่น สีตัวอักษรของพาดหัวหลักพาดหัวรอง, ลักษณะของลิ้งก์เพื่อไปอ่านต่อหน้าใน
วิธีการเลือกใช้ ID กับ Class ใน css
Moderator: mindphp, ผู้ดูแลกระดาน
-
- PHP Hero Member
- โพสต์: 109
- ลงทะเบียนเมื่อ: 03/05/2013 10:44 am
-
- Similar Topics
- ตอบกลับ
- แสดง
- โพสต์ล่าสุด
-
- 0 ตอบกลับ
- 2314 แสดง
-
โพสต์ล่าสุด โดย Ittichai_chupol
21/11/2019 6:39 pm
-
- 2 ตอบกลับ
- 2248 แสดง
-
โพสต์ล่าสุด โดย jamepiyawat
05/09/2019 3:26 pm
-
- 0 ตอบกลับ
- 1939 แสดง
-
โพสต์ล่าสุด โดย Patipat
05/08/2019 11:10 am
-
-
โพสต์ใหม่ วิธีการเรียก class โดยเรียกด้วยคำแค่ส่วนหนึ่งของ class ทั้งหมดใน jquery
โดย ewqolf » 07/02/2023 5:58 pm » ใน jQuery & Ajax Knowledge - 0 ตอบกลับ
- 1284 แสดง
-
โพสต์ล่าสุด โดย ewqolf
07/02/2023 5:58 pm
-
-
-
โพสต์ใหม่ การใช้งาน remove class และ add class เพื่อใช้ งาน css
โดย ewqolf » 06/02/2023 5:04 pm » ใน jQuery & Ajax Knowledge - 0 ตอบกลับ
- 1226 แสดง
-
โพสต์ล่าสุด โดย ewqolf
06/02/2023 5:04 pm
-
ผู้ใช้งานขณะนี้
สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 59