CSS के साथ IE8 में अक्षम HTML नियंत्रणों का रंग बदलना

आपने अक्षम इनपुट नियंत्रणों का रंग बदलने के लिए CSS का उपयोग करने का प्रयास किया है, लेकिन ऐसा लगता है कि यह IE8 में काम नहीं कर रहा है। आप इसका कारण समझना चाहेंगे और डिफ़ॉल्ट व्यवहार को ओवरराइड करने का एक तरीका ढूंढना चाहेंगे।

आपने जिस सीएसएस का उपयोग किया है:

input[disabled='disabled'] {
  color: #666;
}

अधिकांश ब्राउज़रों में अच्छा काम करता है, लेकिन IE8 में नहीं। ऐसा इसलिए है क्योंकि IE8 में अक्षम तत्वों के लिए एक विशिष्ट व्यवहार है, जहां यह एक अजीब सफेद छाया के साथ डिफ़ॉल्ट ग्रे रंग के साथ रंग संपत्ति को ओवरराइड करता है।

इसका कारण यह है कि IE8 में अक्षम तत्वों को माना जाता है "निष्क्रिय" नियंत्रण हों, और ब्राउज़र इसे इंगित करने के लिए उन पर एक विशिष्ट शैली लागू करता है। दुर्भाग्य से, इस शैली में पाठ के लिए एक जबरन ग्रे रंग शामिल है, जो आपके द्वारा लागू किए जाने वाले किसी भी सीएसएस को ओवरराइड करता है।

इस व्यवहार से बचने और IE8 में अक्षम नियंत्रणों का रंग बदलने का एकमात्र तरीका एक अलग दृष्टिकोण का उपयोग करना है . एक संभावित समाधान अक्षम विशेषता के बजाय :अक्षम छद्म वर्ग का उपयोग करना है:

input:disabled {
  color: #666;
}

यह छद्म वर्ग उन तत्वों को लक्षित करता है जिनमें अक्षम विशेषता सेट है, लेकिन यह वास्तव में अक्षम विशेषता सेट नहीं करता है। परिणामस्वरूप, IE8 अब नियंत्रणों को "निष्क्रिय" नहीं मानता है और आपको डिफ़ॉल्ट शैलियों को ओवरराइड करने की अनुमति देता है।