2012-07-16 9 views
50

से सीमा हटाएं मैंने बटन बनाने और मानक बटन छवियों की बजाय अपनी छवियों को डालने का प्रयास किया। हालांकि, मानक बटन से ग्रे सीमा अभी भी बनी हुई है, जो मेरे काले बटन छवियों के बाहर दिखा रही है।बटन

क्या कोई जानता है कि बटन से इस ग्रे सीमा को कैसे हटाया जाए, तो यह केवल छवि ही है? धन्यवाद।

+0

मैं सभी प्रतिक्रियाओं की सराहना करता हूं ... बीमार आपको बताता है कि कौन सा मेरे लिए काम करता है। – JamesonW

+2

एफवाईआई: लिंक नीचे है। – alexander

उत्तर

101

अपने बटन को

padding: 0; 
border: none; 
background: none; 

जोड़ें।

डेमो:

+0

मैं सराहना करता हूं .. लेकिन मैंने स्टाइलशीट से कहा जैसे मैंने जोड़ा और दुर्भाग्य से यह काम नहीं किया। क्या मुझे इसे सीधे एचटीएमएल में एम्बेड करना चाहिए, अगर इससे कोई फर्क पड़ता है? – JamesonW

+0

मैंने बटनों के साथ एक फीड प्लस 'पृष्ठभूमि: कोई नहीं;' बटन जोड़ा। बेवकूफ पर एक चोटी ले लो और देखें कि यह आपके लिए काम करता है या नहीं। – Vestride

2

उपयोग करके देखें: border:0; या border:none;

1

सामान्य चाल छवि को ही एक बटन की बजाय एक लिंक का हिस्सा बनाना है। फिर, आप कस्टम हैंडलर के साथ "क्लिक" ईवेंट को बाध्य करते हैं।

जेक्वायरी-यूआई या बूटस्ट्रैप जैसे फ्रेमवर्क इसे बॉक्स से बाहर करते हैं। उनमें से एक का उपयोग करके पूरी तरह से पूरी तरह से आवेदन अवधारणा को कम कर सकते हैं।

0

आप बटन पर background:none;border:0px भी आजमा सकते हैं।

भी सीएसएस चयनकर्ता div#yes button{..} और div#no button{..} हैं। उम्मीद है यह मदद करता है

+0

इसके अलावा आप इमेज टैग –

+0

का उपयोग करके छवियों के रूप में बटन की पृष्ठभूमि सेट कर सकते हैं या इसे शुद्ध सीएसएस में कर सकते हैं। पृष्ठभूमि की तरह: # 555; फ़ॉन्ट-वेट: बोल्ड: रंग: # एफएफएफ; पैडिंग: 6 पीएक्स 8 पीएक्स; ' –

5

मैं एक ही समस्या हो रही थी और भले ही मैं सीएसएस में मेरी बटन स्टाइल था यह border:none लेने कभी नहीं होगा लेकिन क्या काम किया एक शैली इतनी तरह इनपुट बटन पर सीधे जोड़ने का था:

<div style="text-align:center;"> 
    <input type="submit" class="SubmitButtonClass" style="border:none;" value="" /> 
</div> 
+0

आप एक इनलाइन शैली के साथ संपत्ति को ओवरराइड करने के लिए सीएसएस कैस्केड का उपयोग कर रहे हैं। आपको सीएसएस कैस्केड और सीएसएस विशिष्टता पर कुछ लेख देखना चाहिए। – DrCord

15

यह मेरे लिए पूरी तरह से काम करता प्रतीत होता है।

button:focus { outline: none; } 
+1

'रूपरेखा: कोई नहीं; 'पहुंच के कारणों के लिए अनुशंसित नहीं है। यदि आपको फोकस सीमा को हटाना होगा, तो कृपया उपयोगकर्ताओं के लिए यह देखने का एक और तरीका प्रदान करें कि इसका ध्यान केंद्रित है। http://outlinenone.com/ – Vestride