लिंक पर क्लिक करने के बाद लिंक रेखांकित क्यों दिख रहा है?

Question

मेरे पास text-decoration: none के साथ स्टाइल वाला एंकर टैग है।

इसने मेरे लिंक से नीचे की रेखा को हटा दिया है, जो मैं चाहता हूं।

हालांकि लिंक क्लिक करने के बाद, लिंक के आइकन के बीच रिक्त स्थान के नीचे लिंक अंडरलाइन की छोटी बिट दिखाई देती है।

मैं इस

<a ng-click="toggle(this)" style="text-decoration: none"> 
    <i class="fa fa-caret-down" ng-if="!collapsed"></i> 
    <i class="fa fa-folder-open-o" ng-if="!collapsed"></i> 
    <i class="fa fa-caret-right" ng-if="collapsed"></i> 
    <i class="fa fa-folder-o" ng-if="collapsed"></i> 
</a> 

(का उपयोग करते हुए फॉन्ट भयानक चिह्न) की तरह कुछ

रेखांकन बस माउस के बीच रिक्त स्थान के तहत दिखाई दे रहा है है।

क्या एक बार और हमेशा के लिए उस लिंक को रेखांकित करने का कोई तरीका है ?!

Answer 1

ऐसा इसलिए है क्योंकि लिंक के लिए डिफ़ॉल्ट सीएसएस मान विभिन्न ब्राउज़रों द्वारा घोषित किए जाते हैं। एक लिंक में 4 आधिकारिक राज्य हैं।

• सामान्य
• होवर
• सक्रिय (माउस क्लिक पर)
• देखा गया
• (फोकस)

सीएसएस में आप इन में से प्रत्येक के लिए शैली घोषणा कर सकते हैं। आप लिंक इन राज्यों में text-decoration प्रदर्शित करने के लिए नहीं करना चाहते हैं:

a, a:hover, a:active, a:visited, a:focus { 
    text-decoration:none; 
} 

जवाब अपनी टिप्पणी

हाँ करने के लिए, आप एक classname के साथ एक जगह ले सकता है। उदाहरण के लिए, आपके पास 'myLink' वर्ग के साथ एक लिंक है।

आप सीएसएस बना सकते हैं:

.myLink, .myLink:hover, .myLink:active, .myLink:visited, .myLink:focus { 
    text-decoration:none; 
} 

Answer 2

आप गलत संपत्ति का उपयोग कर रहे हैं ... text-decoration-line इसका मतलब नहीं है।

text-decoration ऑनलाइन संपत्ति को निर्दिष्ट लाइन किस प्रकार, यदि कोई हो, सजावट

उपयोग text-decoration: none होगा बजाय

Answer 3

<style> 
    a{text-decoration:none} 
    a:visited{text-decoration:none} 
</style> 

अपने प्रोजेक्ट में कोई स्टाइलशीट जोड़े

Answer 4

सही तरीका और आपको अपने स्टाई में निम्नलिखित सीएसएस जोड़कर इसे कवर करना चाहिए le चादर परिभाषा:

**Longer CSS Styling definition:** 

a:link { 
    text-decoration: none; 
} 

a:visited { 
    text-decoration: none; 
} 

a:hover { 
    text-decoration: none; 
} 

a:active { 
    text-decoration: none; 
} 

**Shorter CSS definition:** 

a, a:visited, a:hover, a:active { 
    text-decoration:none; 
} 

यह कोई में रेखांकित लिंक के सभी राज्य पूरी तरह से यकीन है कि वहाँ पृष्ठ पर लिंक में से किसी में रेखांकित नहीं होगा होने के लिए सुनिश्चित करेगा। आप अपने सीएसएस में स्टाइलिंग परिभाषा को भी सघन कर सकते हैं ताकि कोड लंबा न हो और शैली सभी लिंक व्यवहार के लिए शैली को नियंत्रित करने के लिए अधिक कुशल है क्योंकि यह पृष्ठ पर सभी लिंक पर लागू होता है जब आप

को परिभाषित कर रहे हैं

आप करते हैं तो आप विशिष्ट लिंक के लिए इसे शैली करना चाहते हैं निम्नलिखित:

a.nav:link {text-decoration: none; } 
a.nav:visited {text-decoration: none; } 
a.nav:hover {text-decoration: none; } 
a.nav:active {text-decoration: none; } 

<a href="/" class="nav">styled links</a>. 

या पूरी तरह से रंग, overline, फ़ॉन्ट वजन, आकार जो प्रत्येक लिंक राज्य में अलग होने जा रहे हैं में जोड़ने अलग कुछ उस विशिष्ट वर्ग के लिए।

a.external:link {color: #0000ff; font-size: 18pt; font-weight: bold; } 
a.external:visited {color: #894f7b; font-weight: bold; } 
a.external:hover {text-decoration: overline; background-color: #003399; } 
a.external:active {color: red; }