सीएसएस के साथ एक लिंक छिपाने के कई तरीकों से किया जा सकता है, लेकिन हम दो विधियों को देखेंगे जिसमें एक यूआरएल पूरी तरह से छुपाया जा सकता है। यदि आप अपनी साइट पर एक स्केवेंजर शिकार या ईस्टर अंडे बनाना चाहते हैं, तो यह लिंक छिपाने का एक दिलचस्प तरीका है।
पहला तरीका पॉइंटर-इवेंट सीएसएस संपत्ति मान के रूप में "none" का उपयोग करके होता है। दूसरा पृष्ठ की पृष्ठभूमि से मेल खाने के लिए टेक्स्ट को बस रंग दे रहा है।
ध्यान रखें कि स्रोत कोड खोजते समय लिंक न तो विधि पूरी तरह गायब हो जाएगी। हालांकि, आगंतुकों को यह देखने के लिए एक सरल, सीधा तरीका नहीं होगा, और आपके नौसिखिया आगंतुकों के पास कोई संकेत नहीं होगा कि लिंक कैसे ढूंढें।
नोट: यदि आप बाहरी स्टाइल शीट को लिंक करने के निर्देशों की तलाश में हैं, तो ये निर्देश आपके बाद नहीं हैं। देखें कि एक बाहरी स्टाइल शीट क्या है? बजाय।
सूचक घटना को अक्षम करें
यूआरएल छिपाने के लिए हम जिस पहली विधि का उपयोग कर सकते हैं वह लिंक को कुछ भी नहीं करना है। जब माउस लिंक पर होवर करता है, तो यह नहीं दिखाएगा कि यूआरएल क्या इंगित करता है और यह आपको इसे क्लिक करने नहीं देगा।
एचटीएमएल को सही ढंग से लिखें
एक वेब पेज, सुनिश्चित करें कि हाइपरलिंक इस तरह पढ़ता है:
ThoughtCo.comबेशक, "https://www.thoughtco.com/" को उस वास्तविक यूआरएल को इंगित करने की आवश्यकता है जिसे आप छुपाएं चाहते हैं, और ThoughtCo.com को आपके द्वारा पसंद किए जाने वाले किसी भी शब्द या वाक्यांश में बदला जा सकता है जो लिंक का वर्णन करता है।
यहां विचार यह है कि लिंक सक्रिय रूप से लिंक को प्रभावी रूप से छिपाने के लिए नीचे सीएसएस के साथ उपयोग किया जाएगा।
इस सीएसएस कोड का प्रयोग करें
सीएसएस कोड को सक्रिय कक्षा को संबोधित करने और ब्राउजर को समझाया जाना चाहिए कि लिंक क्लिक पर होने वाली घटना "इस तरह" नहीं होनी चाहिए:
निष्क्रिय {सूचक-घटनाएं: कोई नहीं; कर्सर: डिफ़ॉल्ट; }आप JSFiddle पर इस विधि को कार्रवाई में देख सकते हैं। यदि आप वहां सीएसएस कोड हटाते हैं, और फिर डेटा को फिर से चालू करते हैं, तो लिंक अचानक क्लिक करने योग्य और प्रयोग योग्य हो जाता है। ऐसा इसलिए है क्योंकि जब सीएसएस लागू नहीं होता है, तो लिंक सामान्य रूप से व्यवहार करता है।
नोट: याद रखें कि यदि उपयोगकर्ता पृष्ठ के स्रोत कोड को देखता है, तो वे लिंक देखेंगे और पता चलेगा कि यह कहां जाता है क्योंकि हम ऊपर देखते हैं, कोड अभी भी वहां है, यह केवल उपयोग योग्य नहीं है।
लिंक का रंग बदलें
आम तौर पर, एक वेब डिज़ाइनर पृष्ठभूमि की तुलना में हाइपरलिंक्स को एक अलग रंग बना देगा ताकि आगंतुक वास्तव में उन्हें देख सकें और जान सकें कि वे कहां जाते हैं। हालांकि, हम यहां लिंक छिपाने के लिए हैं , तो देखते हैं कि पेज के मिलान के लिए रंग को कैसे बदला जाए।
एक कस्टम कक्षा परिभाषित करें
यदि हम ऊपर की पहली विधि से एक ही उदाहरण का उपयोग करते हैं, तो हम कक्षा को बस जो कुछ भी चाहते हैं उसे बदल सकते हैं ताकि केवल विशेष लिंक छुपाए जाएं।
अगर हमने कक्षा का उपयोग नहीं किया और इसके बजाय सीएसएस को नीचे से प्रत्येक लिंक पर लागू किया, तो वे सभी गायब हो जाएंगे। यही वह नहीं है जो हम यहां हैं, इसलिए हम इस एचटीएमएल कोड का उपयोग करेंगे जो कस्टम हिडेम क्लास का उपयोग कर रहा है:
ThoughtCo.comक्या रंग का उपयोग करने के लिए पता लगाएं
लिंक को छिपाने के लिए उचित सीएसएस कोड दर्ज करने से पहले, हमें यह पता लगाना होगा कि हम किस रंग का उपयोग करना चाहते हैं। यदि आपके पास पहले से ही ठोस पृष्ठभूमि है, जैसे सफेद या काला, तो यह आसान है। हालांकि, अन्य विशेष रंगों को भी सटीक होना चाहिए।
उदाहरण के लिए, यदि आपके पृष्ठभूमि रंग में e6ded1 का हेक्स मान है, तो आपको यह जानने की आवश्यकता है कि सीएसएस कोड के लिए पृष्ठ के लिए ठीक से काम करने के लिए आप इसे गायब करना चाहते हैं।
इनमें से बहुत सारे "रंग पिकर" या "आइड्रोप्रोप" उपकरण उपलब्ध हैं, जिनमें से एक को क्रोम ब्राउज़र के लिए कलरपिक आइड्रोप्रॉपर कहा जाता है। हेक्स रंग प्राप्त करने के लिए अपने वेब पेज के पृष्ठभूमि रंग का नमूना देने के लिए इसका इस्तेमाल करें।
रंग बदलने के लिए सीएसएस को अनुकूलित करें
अब आपके पास लिंक होना चाहिए कि लिंक होना चाहिए, सीएसएस कोड लिखने के लिए, ऊपर और कस्टम क्लास मान का उपयोग करने का समय है:
.hideme {रंग: # e6ded1; }यदि आपका पृष्ठभूमि रंग सफेद या हरे रंग की तरह सरल है, तो आपको इससे पहले # चिह्न नहीं रखना होगा:
। hideme {रंग: सफेद; }इस JSFiddle में इस विधि का नमूना कोड देखें।