css - टेक्स्ट/इनपुट बॉक्स के आस-पास सीमा(रूपरेखा) को कैसे हटाएं?(क्रोम)




google-chrome input (8)

इस प्रश्न का उत्तर यहां दिया गया है:

क्या कोई पाठ / इनपुट बॉक्स के आस-पास नारंगी या नीली सीमा (रूपरेखा) को हटाने का तरीका बता सकता है? मुझे लगता है कि क्रोम पर यह केवल यह दिखाने के लिए होता है कि इनपुट बॉक्स सक्रिय है। मैं जिस इनपुट सीएसएस का उपयोग कर रहा हूं वह यहां है:

input {
    background-color: transparent;
    border: 0px solid;
    height: 20px;
    width: 160px;
    color: #CCC;
}


टेक्स्ट बॉक्स की सीमा को हटाने और ब्राउज़र शैली की हाइलाइट सीमा को हटाने के लिए कृपया निम्न वाक्यविन्यास का उपयोग करें।

input {
    background-color:transparent;
    border: 0px solid;
    height:30px;
    width:260px;
}
input:focus {
    outline:none;
}

मुझे पता चला कि आप इसका भी उपयोग कर सकते हैं:

input:focus{
   border: transparent;
}

यह निश्चित रूप से काम करेगा। ऑरेंज रूपरेखा अब और नहीं दिखाएगी .. सभी टैग के लिए आम:

*:focus {
    outline: none;
}

कुछ टैग के लिए विशिष्ट, पूर्व: इनपुट टैग

input:focus {
   outline:none;
}

यह सभी और किसी भी तत्व से क्रोम में नारंगी फ्रेम को हटाता है इससे कोई फर्क नहीं पड़ता कि यह कहां और कहाँ है

*:focus {
    outline: none;
}

वर्तमान उत्तर बूटस्ट्रैप 3.1.1 के साथ मेरे लिए काम नहीं किया। यहां मुझे ओवरराइड करना था:

.form-control:focus {
  border-color: inherit;
  -webkit-box-shadow: none;
  box-shadow: none;
}

सेट

input:focus{
    outline: 0 none;
}

"महत्वपूर्ण!" बस मामले में है। यह जरूरी नहीं है। [और अब यह चला गया है। -ईडी।]


<input style="border:none" >

मेरे लिए अच्छा काम किया। यह खुद को एचटीएमएल में तय करना चाहता था ... :)


input:focus {
    outline:none;
}

इससे चल जाएगा। ऑरेंज रूपरेखा अब और दिखाई नहीं देगी।





border