HTML में एक लिंक से अंडरलाइन कैसे निकालें?


130

अपने पेज में मैंने कुछ लिंक डाले हैं जिनके तहत मुझे कोई लाइन नहीं चाहिए, इसलिए, मैं HTML का उपयोग करके कैसे हटा सकता हूं?


4
Paic, मैं फिर से टैग वापस करने की जहमत नहीं उठाने जा रहा हूँ, लेकिन जैसा कि आप जानते हैं, अंडरलाइन को हटाने का एकमात्र तरीका CSS के साथ है । हां, भले ही आप इसे HTML के साथ इनलाइन जोड़ रहे हों ( styleविशेषता में), यह अभी भी CSS है । अन्य दो टैग भी पूरी तरह से वैध ( presentationऔर hyperlink) हैं। जब तक ऐसा करने का कोई वाजिब कारण न हो, भविष्य में, कृपया किसी प्रश्न के टैग को न हटाएं (या जोड़ें)। धन्यवाद!
0b10011

@bfrohs मैं आपके शब्दों का सम्मान करता हूं, लेकिन मैं केवल HTML का उपयोग करके अपनी साइट का निर्माण कर रहा हूं और इसलिए मैंने अधिक टैग नहीं जोड़े क्योंकि अगर मैंने ऐसा किया होता, तो मुझे अलग-अलग भाषा के उत्तर मिल सकते थे। वास्तव में मैं इसके लिए थोड़ा नौसिखिया हूं, यही कारण है।
पैनिक टेन

3
आप बिना CSS के मानकों के अनुरूप वेबसाइट नहीं बना सकते (जब तक कि आप सभी प्रस्तुति के लिए ब्राउज़र डिफॉल्ट्स के साथ नहीं जाते)। HTML = संरचना; सीएसएस = प्रस्तुति। अन्य टैग का एक अलग भाषा से कोई लेना-देना नहीं था - वे केवल लोगों को सवाल और जवाब खोजने में मदद करने के लिए प्रदान किए गए थे।
0b10011


2
इस सवाल में इतने वोट क्यों हैं? आप इसका उत्तर Google की एकल खोज में दे सकते हैं और मुझे यकीन है कि StackOverflow पर इसके कई डुप्लिकेट हैं।
अल्टरनेटेक्स

जवाबों:


192

इनलाइन संस्करण:

<a href="http://yoursite.com/" style="text-decoration:none">yoursite</a>

हालाँकि याद रखें कि आपको आमतौर पर अपनी वेबसाइट की सामग्री को अलग करना चाहिए (जो HTML है ), प्रस्तुति से (जो कि सीएसएस है )। इसलिए आपको आम तौर पर इनलाइन शैलियों से बचना चाहिए ।

देखें जॉन जवाब का उपयोग कर बराबर जवाब देखने के लिए सीएसएस


1
हत्यारा! मैंने उन सभी वर्षों में इन अंडरस्कोर लाइनों को कभी नहीं देखा, जहां मैं html कर रहा हूं .... ^ ^
एलेक्स Cio

1
जॉन का जवाब अभी भी अनिवार्य रूप से इनलाइन शैलियों का उपयोग करता है। अपने CSS को अलग करने का मतलब है अपने html में aliasing css से ज्यादा। उदाहरण के class="big-and-red"लिए अलगाव नहीं है। class="meaningful-domain-item"तो सीएसएस .meaningful-domain-item { //big and red }है। यह उत्तर मुझे याद दिलाने के लिए पर्याप्त है कि मेरे सीएसएस +1 में किस टैग का उपयोग करना है।
नाथन कूपर

यह उपर्युक्त कोड मेरे लिए काम नहीं आया। जब मुझे समस्या का पता चला तो मुझे लगा कि यह काम नहीं कर रहा है क्योंकि मैंने शैली को href के बाद रखा था। जब मैंने शैली को href से पहले रखा तो यह उम्मीद के मुताबिक काम कर रही थी। <a href=" yoursite.com "style="text-decoration:none"> आपका वर्णन </a>
गणेश एमएस

55

यह सभी लिंक से सभी अंडरलाइन को हटा देगा:

a {text-decoration: none; }

यदि आपके पास विशिष्ट लिंक हैं जो आप इसे लागू करना चाहते हैं, तो उन्हें एक क्लास नाम दें, जैसे nounderlineऔर यह करें:

a.nounderline {text-decoration: none; }

यह केवल उन लिंक्स पर लागू होगा और सभी अन्य को अप्रभावित छोड़ देगा।

यह कोड <head>आपके दस्तावेज़ या स्टाइलशीट में है:

<head>
    <style type="text/css">
        a.nounderline {text-decoration: none; }
    </style>
</head>

और शरीर में:

<a href="#" class="nounderline">Link</a>

15

मैं उपयोग करने का सुझाव देता हूं: यदि माउस पॉइंटर एक लंगर के ऊपर है तो अंडरलाइन से बचने के लिए होवर करें

a:hover {
   text-decoration:none;
}

6
  1. इसे अपनी बाहरी शैली शीट में जोड़ें ( पसंदीदा ):

    a {text-decoration:none;}
  2. या <head>अपने HTML दस्तावेज़ में इसे जोड़ें :

    <style type="text/css">
     a {text-decoration:none;}
    </style>
    
  3. या इसे aस्वयं तत्व में जोड़ें ( अनुशंसित नहीं ):

    <!-- Add [ style="text-decoration:none;"] -->
    <a href="http://example.com" style="text-decoration:none;">Text</a>
    

4

अन्य उत्तरों में सभी पाठ-सजावट का उल्लेख है। कभी-कभी आप एक वर्डप्रेस थीम या किसी और के सीएसएस का उपयोग करते हैं जहां लिंक अन्य तरीकों से रेखांकित होते हैं, ताकि टेक्स्ट-डेकोरेशन: कोई भी रेखांकित नहीं होगा।

बॉर्डर और बॉक्स-शैडो दो अन्य विधियां हैं जो मुझे लिंक को रेखांकित करने के लिए जानते हैं। इन्हें बंद करने के लिए:

border: none;

तथा

box-shadow: none;

2

निम्नलिखित एक सर्वोत्तम अभ्यास नहीं है, लेकिन कभी-कभी उपयोगी साबित हो सकता है

जॉन कोनडे द्वारा प्रदान किए गए समाधान का उपयोग करना बेहतर है, लेकिन कभी-कभी, बाहरी सीएसएस का उपयोग करना असंभव है। तो आप अपने HTML टैग में निम्नलिखित जोड़ सकते हैं:

<a style="text-decoration:none;">My Link</a>

1
<style="text-decoration: none">

उपरोक्त कोड पर्याप्त होगा। जिस लिंक को आप अंडरलाइन से हटाना चाहते हैं, उसमें बस पेस्ट करें।


1

उपर्युक्त सभी कोड मेरे लिए काम नहीं करते थे। जब मुझे समस्या का पता चलता है तो मुझे लगता है कि यह काम नहीं कर रहा था क्योंकि मैंने शैली को href के बाद रखा था। जब मैंने शैली को href से पहले रखा तो यह उम्मीद के मुताबिक काम कर रही थी।

<a style="text-decoration:none" href="http://yoursite.com/">yoursite</a>
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.