โดย พร อันทะ เมื่อ 2007-08-21 10:40:09 ดูทั้งหมด 1056 ครั้ง
ผมรู้สึกว่ามันเป็นเรื่องพื้นฐาน ที่เราต้องทำความเข้าใจกันตั้งแต่แรก หลายๆ คน อาจจะมองข้ามสิ่งเหล่านี้ไป ทั้งๆ ที่มันเป็นแก่นสาร สาระสำคัญของชีวิต
บ้างบางคน สนใจแค่อยากทำเว็บให้ได้ ทำเว็บให้หรู มัวแต่โชว์ระบบ วูบวาบหวือหวา ทำได้นั้นมันทำได้ครับ แต่ขอทำให้เป็นด้วย จะสุดยอดพระเจ้าแลอัณญาโกณทัญญะมาก เข้าใจว่าตัวเองกำลังเขียน หรือปฏิบัติภาวะการณ์ อันใดอยู่
วันนี้ เรามาย้อนรอยเรื่อง CSS Selectors กันแบบหนักๆ สักตั้งครับ
หลายคนคงรู้และเข้าใจเรื่อง class และ id กันไปบ้างแล้ว แต่บางคนอาจจะยังไม่เข้าใจจริงๆ ว่ามันต่างกันยังไง Attribute selectors สองตัวนี้มันทำงานยังไงกันแน่ และหลายคนยังไม่รู้ว่ามันต่างกันมากมาย
เริ่มกันโลด
เปิดฉากอย่างเร้าใจกับ Selector Syntax การเขียน CSS Selector นั้นมันมีการผสมผสานหลายๆ selectors เข้าด้วยกันได้ ด้วย การเคาะ การใช้เครื่องหมาย > เครื่องหมาย +
อย่างเช่น
h1, p + dl > dd { color: #ff9900; }การเลือกทุกสิ่งให้กับชีวิตด้วย Universal selector เราใช้เครื่องหมาย *
ตัวอย่าง
* { paddibg: 0;margin: 0;}หมายถึง ทุก อีเลเม้นที่อยู่ใน document นั้น ให้มี padding และ margin เป็น 0 ตามด้วย Type selectors คือการเขียนชื่อ Element ลงไปเลยนั่นเองครับ เช่น
span { display: block; width: 100%; }เออนะ แล้วผมจะมานั่งแปลให้อ่านอยู่ทำไมเนี่ย ในเมื่อ W3C เขาเขียนไว้แล้ว อ้าว ลองอ่านจากงานวิจัย งานพัฒนาจากเจ้าของภาษากันเลยดีไหมครับพี่น้อง
อ่านกันก่อน เดี๋ยววันหลัง ผมจะมาลองเล่นตัวอย่างให้ดูเพราะว่าถ้าผมนั่งเขียนต่อไป มันรู้สึกเหมือน ทำงานซ้ำๆ วนไปวนมา มีลิงค์ให้แล้ว
อ่านเรื่อง Selectors ทั้งหมด ที่นี่เลยครับ
Tags:
Unknown Version Unknown
