CSS इनपुट के लिए <इनपुट प्रकार = "?"

Question

क्या सीएसएस के पास अपने प्रकार के आधार पर सभी इनपुटों को लक्षित करने का कोई तरीका है? मेरे पास एक विकलांग वर्ग है जो मैं विभिन्न विकलांग फॉर्म तत्वों पर उपयोग करता हूं, और मैं टेक्स्ट बॉक्स के लिए पृष्ठभूमि रंग सेट कर रहा हूं, लेकिन मैं नहीं चाहता कि मेरे चेकबॉक्स को वह रंग मिले।

मुझे पता है कि मैं अलग वर्गों के साथ ऐसा कर सकता हूं, लेकिन यदि संभव हो तो मैं सीएसएस का उपयोग करूंगा। मुझे यकीन है, मैं इसे जावास्क्रिप्ट में सेट कर सकता हूं लेकिन फिर से सीएसएस की तलाश कर रहा हूं।

मैं IE7 + को लक्षित कर रहा हूं। इसलिए मुझे नहीं लगता कि मैं CSS3 का उपयोग कर सकता हूं।

संपादित करें

CSS3 के साथ मैं कुछ ऐसा करने में सक्षम होगा?

INPUT[type='text']:disabled यह बेहतर होगा कि मेरी कक्षा से पूरी तरह छुटकारा पा लिया जाए ...

संपादित करें

ठीक है, मदद के लिए धन्यवाद! तो यहाँ एक चयनकर्ता है जो सभी पाठ बॉक्स और क्षेत्रों को संशोधित करता है, जिन्हें किसी भी वर्ग की आवश्यकता के बिना अक्षम कर दिया गया है, जब मैंने यह प्रश्न शुरू किया था तो मैंने कभी नहीं सोचा था कि यह संभव है ...

INPUT[disabled][type='text'], TEXTAREA[disabled]
{   
    background-color: Silver;
}

यह IE7 में काम करता है

Comments

मैंने सीएसएस विशेषता चयनकर्ताओं के बारे में कुछ विस्तृत जानकारी के साथ एक लेख लिखा है ।

— सरफराज

Answer 1

हाँ। IE7 + विशेषता चयनकर्ताओं का समर्थन करता है:

input[type=radio]
input[type^=ra]
input[type*=d]
input[type$=io]

तत्व प्रकार के साथ तत्व इनपुट जिसमें एक मान होता है जो एक निश्चित मान के साथ होता है, जिसके साथ शुरू होता है, होता है या समाप्त होता है।

अन्य सुरक्षित (IE7 +) चयनकर्ता हैं:

• माता-पिता> बच्चा जो है: p > span { font-weight: bold; }
• पूर्ववर्ती ~ तत्व जो है: span ~ span { color: blue; }

जो <p><span/><span/></p>आपको प्रभावी रूप से देगा:

<p>
    <span style="font-weight: bold;">
    <span style="font-weight: bold; color: blue;">
</p>

आगे पढ़ने: quirksmode.com पर ब्राउज़र सीएसएस संगतता

मुझे आश्चर्य है कि हर कोई सोचता है कि यह नहीं किया जा सकता है। सीएसएस विशेषता चयनकर्ता कुछ समय पहले से ही यहां हैं। मुझे लगता है कि यह समय है जब हम अपनी .css फ़ाइलों को साफ़ करते हैं।

Comments

ठीक है, मैंने यह कोशिश की थी, लेकिन यह अब काम नहीं कर रहा था इसलिए मैं अपने सिंटैक्स को गड़बड़ कर रहा हूं।

— जोशबर्के

तुमने मेरा दिन बना दिया! अब अगर आप मेरा हफ्ता बनाना चाहते हैं तो मुझे बताएं कि यह IE6 में बिना एक्सप्रेशंस के किया जा सकता है hehe :-) j / k वहाँ

— जोशबर्के

दुर्भाग्य से यह नहीं हो सकता। मैंने IE6 को धार्मिक विचारों से समर्थन देना बंद कर दिया और सुझाव दिया कि हम सब भी ऐसा करें। आज मैं उपयोगकर्ताओं को यह बताने के लिए IE सशर्त टिप्पणी का उपयोग करता हूं कि IE6 का उपयोग करने के लिए उनके कंप्यूटर और गोपनीयता को खतरा है और उन्हें तुरंत अपग्रेड करना चाहिए: P

— Filip Dupanović

मुझे लगता है कि मैं IE6 का समर्थन करने के लिए इस्तेमाल कर रहा हूँ मुझे लगता है कि यह IE7 में या तो काम नहीं करेगा

— TJ L

काश मैं IE6 का समर्थन करना बंद कर सकता हूं, लेकिन मैं सुझाव नहीं दे सकता और मैं ऐसा नहीं कर सकता ... जैसा कि आपने सुझाव दिया था ... लेकिन मैं वास्तव में वास्तव में चाहता हूं कि मैं ;-)

— जोशबर्के

Answer 2

अफसोस की बात है कि अन्य पोस्टर सही हैं कि आप वास्तव में ... क्रोन द्वारा सही किए गए हैं, आप अपने IE7 और एक सख्त डॉक्टर के साथ ठीक हैं, लेकिन IE6 आवश्यकताओं के साथ हम में से अधिकांश जेएस या इस के लिए वर्ग संदर्भ कम हो गए हैं, लेकिन यह है CSS2 की संपत्ति, IE ^ h ^ h ब्राउज़रों से पर्याप्त समर्थन के बिना।

पूर्णता से बाहर, चयनकर्ता प्रकार है - xpath के समान - रूप में, [attribute=value]लेकिन कई दिलचस्प संस्करण मौजूद हैं। यह होगा काफी शक्तिशाली हो जब यह उपलब्ध है, तो अच्छी बात IE8 के लिए अपने दिमाग में रखने के लिए।

• w3 संदर्भ

• ब्राउज़र समर्थन संदर्भ

Comments

आपके पास अधिक अद्यतन ब्राउज़र समर्थन संदर्भ है? यह IE7 पर आधारित है जो IE8

— जोशबर्के

IE8 अभी भी बीटा में है, लेकिन quirksmode "हाँ" कहता है: quirksmode.org/css/contents.html

— annakata

मैं अभी भी IE6 का समर्थन कर रहा हूं यह सिर्फ छोटे दृश्य ट्विक नहीं जोड़े गए हैं।

— जोशबर्के

उचित रूप से, शीर्षक के आधार पर उत्तर देना मेरी भूल थी, मैं सामान्य मामलों का उत्तर देता हूं - मुझे वास्तव में अधिक प्रश्न पढ़ने चाहिए :)

— अन्नाकाटा

Answer 3

आप इसे jQuery के साथ कर सकते हैं। उनके चयनकर्ताओं का उपयोग करके, आप इस तरह के रूप में, विशेषताओं के अनुसार चयन कर सकते हैं। हालाँकि, यह आवश्यक है कि आपके उपयोगकर्ताओं के पास जावास्क्रिप्ट चालू हो, और डाउनलोड करने के लिए एक अतिरिक्त फ़ाइल हो, लेकिन अगर यह काम करता है ...

Answer 4

क्षमा करें, संक्षिप्त उत्तर नहीं है। CSS (2.1) केवल DOM के तत्वों को चिह्नित करेगा, न कि उनकी विशेषताओं को। आपको प्रत्येक इनपुट के लिए एक विशिष्ट वर्ग लागू करना होगा।

Bummer मुझे पता है, क्योंकि यह अविश्वसनीय रूप से उपयोगी होगा।

मुझे पता है कि आपने कहा है कि आप जावास्क्रिप्ट पर CSS पसंद करेंगे, लेकिन आपको अभी भी jQuery का उपयोग करने पर विचार करना चाहिए। यह विशेषताओं के आधार पर DOM तत्वों में शैलियों को जोड़ने का एक बहुत ही स्वच्छ और सुरुचिपूर्ण तरीका प्रदान करता है।

Comments

jquery ऐसा करने का तरीका है, या सामान्य रूप से सिर्फ जावास्क्रिप्ट

— ट्रैविसो

Afaict, यह उत्तर गलत है (CSS 2.1 भाग): w3.org/TR/CSS21/selector.html#attribute-selectors । यदि नहीं, तो कृपया आप उत्तर स्पष्ट करें।

— cic

क्षमा करें - आप काफी सही हैं। मैं सिर्फ IE7 से कम से कम उम्मीद करता हूं क्योंकि अक्सर डेवलपर्स को अभी भी उसी समय IE6 का समर्थन करने की आवश्यकता होती है। प्रश्न को अधिक ध्यान से पढ़ना चाहिए और अपना होमवर्क करना चाहिए।

— फिल। वेहलर