एचटीएमएल अक्षम बटन हो रही: सक्रिय सीएसएस छद्म वर्ग

Question

सीएसएस:

button:active { 
/* active css */ 
} 

button:disabled { 
    opacity: 0.5; 
} 

HTML:

<button disabled="disabled">Ok</button> 

जब मैं बटन पर क्लिक करें ब्राउज़र बटन जोड़ता है: सक्रिय राज्य यह देखने के लिए की तरह क्लिक होने बनाने (भले ही यह अक्षम है)। मैं कसम खाता हूँ मैंने सोचा: सक्रिय किया गया था अगर बटन सक्षम किया गया था। मुझे क्या याद आया?

Answer 1

जो मैं बता सकता हूं, :active:disabled तत्वों को बाहर नहीं करता है। यदि आप चाहें तो spec पढ़ सकते हैं।

अपनी समस्या को हल करने के लिए, आप अपने :active चयनकर्ता के साथ ही :enabled तत्वों को लक्षित करके :disabled तत्वों को बाहर कर सकते:

button:enabled:active { 
/* active css */ 
} 

button:disabled { 
    opacity: 0.5; 
} 

डेमो: http://jsfiddle.net/Blender/LRvra/1/

Answer 2

According to the CSS3 specification (:disabled CSS2.1 में नहीं है) इसमें कोई उल्लेख नहीं है कि :active और :disabled पारस्परिक रूप से अनन्य हैं। यह संभव है कि विनिर्देश के इस हिस्से को स्पष्टीकरण की आवश्यकता है ताकि UAs छद्म-वर्ग संयोजन में लागू हो सकें।

मैं सुझाव है कि आप अधिक स्पष्ट होना करने के लिए अपने चयनकर्ताओं को संशोधित:

button:enabled:active { 
    /* active css */ 
} 
button:disabled { 
    opacity: 0.5; 
} 

Answer 3

तुम भी इस्तेमाल कर सकते हैं: नहीं() - सीएसएस के वर्णनकर्ता:

button:active:not(:disabled) { 
/* active css */ 
} 

button:disabled { 
    opacity: 0.5; 
} 

तुम सब लोग सबसे अच्छा चाहते हैं, पेट्रिक