[html] पाठ इनपुट फ़ील्ड के लिए सीएसएस चयनकर्ता?


Answers

आप यहां विशेषता चयनकर्ता का उपयोग कर सकते हैं:

input[type="text"] {
    font-family: Arial, sans-serif;
}

यह आईई 7 और ऊपर में समर्थित है। यदि आप IE6 का समर्थन करने की आवश्यकता है तो आप इसके लिए समर्थन जोड़ने के लिए IE7.js का उपयोग कर सकते हैं।

देखें: अधिक जानकारी के लिए http://reference.sitepoint.com/css/attributeselector

Question

मैं सीएसएस चयनकर्ताओं का उपयोग कर 'टेक्स्ट' प्रकार के इनपुट फ़ील्ड को कैसे लक्षित कर सकता हूं?




गुण चयनकर्ताओं को अक्सर इनपुट के लिए उपयोग किया जाता है। यह विशेषता चयनकर्ताओं की सूची है:

[शीर्षक] शीर्षक विशेषता वाले सभी तत्व चुने गए हैं।

[शीर्षक = केला] सभी तत्व जिनके शीर्षक शीर्षक का 'केला' मान है।

[शीर्षक ~ = केला] सभी तत्व जिनमें शीर्षक विशेषता के मूल्य में 'केला' होता है।

[शीर्षक | = केले] शीर्षक तत्व के सभी तत्व जो 'केला' से शुरू होते हैं।

[शीर्षक ^ = केले] शीर्षक तत्व के सभी तत्व जो 'केला' से शुरू होते हैं।

[शीर्षक $ = केला] सभी तत्व जो शीर्षक विशेषता का मान 'केला' के साथ समाप्त होता है।

[शीर्षक * = केला] सभी तत्व जो शीर्षक विशेषता के मूल्य में सबस्ट्रिंग 'केला' शामिल हैं।

संदर्भ: https://kolosek.com/css-selectors/




जैसा कि @Amir ऊपर पोस्ट किया गया है, आजकल सबसे अच्छा तरीका - क्रॉस-ब्राउज़र और आईई 6 के पीछे छोड़ना - उपयोग करना है

[type=text] {}

किसी ने भी कम सीएसएस विशिष्टता का उल्लेख नहीं किया है (यह why important ?) अब तक, [type=text] 0,0,1,0 input[type=text] साथ 0,0,1,1 input[type=text]

प्रदर्शन के अनुसार अब और कोई नकारात्मक प्रभाव नहीं है।

v4.0.0 को सामान्यीकृत करें जो कम चयनकर्ता विशिष्टता के साथ जारी किया गया है




आप टाइप टेक्स्ट के साथ सभी इनपुट का चयन करने के लिए :text चयनकर्ता का उपयोग कर सकते हैं

कामकाजी पहेली

$(document).ready(function () {
    $(":text").css({    //or $("input:text")
        'background': 'green',
        'color':'#fff'
    });
});

:text एक jQuery एक्सटेंशन है और सीएसएस विनिर्देश का हिस्सा नहीं है, इसका उपयोग करने वाले प्रश्न: टेक्स्ट देशी DOM क्वेरीSelectorAll () विधि द्वारा प्रदान किए गए प्रदर्शन बूस्ट का लाभ नहीं ले सकता है। आधुनिक ब्राउज़रों में बेहतर प्रदर्शन के लिए, इसके बजाय [type="text"] उपयोग करें। यह IE6+ लिए काम करेगा।

$("[type=text]").css({  // or $("input[type=text]")
    'background': 'green',
    'color':'#fff'
});

सीएसएस

[type=text] // or input[type=text] 
{
    background: green;
}



Related