css selector ในรูปแบบที่เราใช้กันนอกจาก id และ class แล้วยังมีการใ้ช้ในรูปแบบอื่นๆอีก ในที่นี้จะยกตัวอย่าง ในแบบอื่นๆบ้าง
css selector แบบแรก เพื่ออ้างอิงชื่อ attribute โดยรูปแบบจะเป็นดังนี้ selector[attribute] คือ จะเลือก elements ที่มี attribute ตามที่กำหนดเท่านั้น
h1 [ title ] { color : blue ; ]
ก็คือ เลือกแท็ก h1 ที่มี attribute title เท่านั้น
h1 [ title = ” I Love You ” ] { color : orange ; }
ก็คือ เลือกแท็ก h1 ที่มี attribute tile ที่มีชื่อว่า I Love You เท่านั้น
header > a : hover [ href ] { background : green ; }
ก็คือ เลือกแท็ก a ที่อยู่ภายใต้แท็ก header และมีการกำหนด attribute href เอาใว้ โดยถ้าเอาเมาส์ไป hover (hover คือ เอาเมาส์ไปชี้) ก็จะเปลี่ยนเป็นสีเขียว
div [ class ~= boy ] { padding : 10px ; margin : 10px ; }
ก็คือ เลือกแท็ก div โดยให้ class ขึ้นต้นด้วยอะไรก็ได้แต่ลงท้ายด้วย boy
h1 [ title ~= girl ] { color : red ; }
ก็คือ เลือกแท็ก h1 ที่มี title ที่ลงท้ายด้วย girl
เพียงเท่านี้ก็ได้เทคนิคดีๆ ที่นำไปพัฒนาต่อยอดได้อีกแล้วนะครับ
ยังมีบทความอื่นๆที่น่าสนใจอีกมากมาย เข้าไปอ่านเพิ่มเติมที่เว็บไซต์ หรือกดติดตาม Facebook ที่ link ด้านล่างนี้ได้เลยครับ
ความเห็นล่าสุด