ตัวเลือกแอตทริบิวต์ CSS สำหรับแอตทริบิวต์ที่ไม่ว่างเปล่า


92

มีตัวเลือก CSS ที่ใช้กับแอตทริบิวต์ที่ไม่ว่างเปล่าหรือไม่? ใช้การ:not([Data-Attribute=''])จับคู่หากแอตทริบิวต์ไม่มีอยู่ด้วย

[Data-Attribute!='']ฉันกำลังมองหาสิ่งที่ต้องการ


มันจะไม่เหมือนกับ[Data-Attribute!='']ถ้าคุณกำลังพูดถึงตัวเลือก jQuery เนื่องจากตัวเลือก jQuery นั้นเทียบเท่า:not([Data-Attribute=''])และตรงกันหากไม่ได้ระบุแอตทริบิวต์
BoltClock

คำตอบ:


197

ลองดู

<style>
    [Data-Attribute]:not([Data-Attribute=""])
    {
        background-color: Red;
    }
</style>

8
ฉันเคยเห็นวิธีแก้ปัญหาที่ดีกว่า (หรืออื่น) ที่นี่: stackoverflow.com/questions/16429220/…
Sven

6
@Sven ทางออกเดียวในลิงก์นั้นที่ตอบคำถามนี้ (เลือกแอตทริบิวต์ข้อมูลเฉพาะที่ไม่ว่างเปล่า) จะเหมือนกับคำตอบนี้
rybo111

ใช่โซลูชันที่ให้ไว้ที่นี่กำหนดเป้าหมายสิ่งที่เขาต้องการส่วนในลิงก์ด้านบนต้องใช้รูปแบบที่ตอบโต้
จะ

โซลูชันนี้มีผลต่อองค์ประกอบที่ไม่คาดคิด (หากตรงกับ attr title)
Pavel Vlasov
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.