CSS ကိုအသုံးပြုခြင်း Links များ Hide လုပ်နည်း

CSS နဲ့ link တစ်ခုပုန်းအောင်းနည်းလမ်းတွေထဲကအတော်များများလုပ်ဆောင်နိုင်တယ်, ဒါပေမယ့်ကျွန်တော်တစ်ဦး URL ကိုလုံးဝအမြင်ကနေဝှက်ထားနိုင်သည့်အတွက်နှစ်ခုနည်းလမ်းများကိုကြည့်ပါလိမ့်မယ်။ သင်သည်သင်၏ site ပေါ်တွင်တစ်ဦး scavenger အမဲလိုက်ခြင်းသို့မဟုတ်အီစတာကြက်ဥဖန်တီးချင်တယ်ဆိုရင်, ဒီလင့်များဖုံးကွယ်ဖို့စိတ်ဝင်စားဖို့နည်းလမ်းဖြစ်ပါတယ်။

ပထမဦးဆုံးနည်းလမ်း pointer-ဖြစ်ရပ်များ CSS ကိုပိုင်ဆိုင်မှုတန်ဖိုးကိုအဖြစ် "အဘယ်သူမျှမ" ကိုအသုံးပြုခြင်းအားဖြင့်ဖြစ်ပါသည်။ အခြားရိုးရိုးစာမျက်နှာ၏နောက်ခံကိုက်ညီမှစာသား coloring ဖွငျ့ဖွစျသညျ။

မနည်းကို link ကိုလုံးဝ source code ကိုရှာဖွေတဲ့အခါမှာတွေ့ရှိခဲ့ခံရခြင်းမှပျောက်ကွယ်သွားစေမည်ဟုစိတ်ကိုထားပါ။ သို့သော်ဧည့်သည်များကကြည့်ဖို့ရာအတွက်ရိုးရှင်းတဲ့, ရိုးလမ်းရှိသည်မဟုတ်ပါလိမ့်မယ်, သင်၏အတွေ့အကြုံမရှိသေးသောဧည့်သည်ကိုဘယ်လို link ကိုရှာတွေ့ဖို့သဲလွန်စရှိသည်မဟုတ်ပါလိမ့်မယ်။

မှတ်စု: သင်အနေနဲ့ external style sheet လင့်ထားသည်ဖို့ဘယ်လိုညွှန်ကြားချက်ရှာနေဆိုပါကဤညွှန်ကြားချက်ကိုသင်ပြီးနောက်နေအဘယျသို့မဟုတျပါ။ ကြည့်ရှုပါ ကဘာလဲအနေနဲ့ external style sheet? အစား။

အဆိုပါညွှန်း Event ကို Disable

ကျွန်တော်တစ်ဦး URL ကိုဖျောက်ရန်ကိုသုံးနိုင်သည်ကိုပထမဦးဆုံးနည်းလမ်း link ကိုဘာမျှမလုပ်ပေးစေရန်ဖြစ်ပါသည်။ မောက် link ကိုကျော်ရှိတယ်လို့သိရပါတယ်အခါ, အဲဒါကိုသင်ကကလစ်နှိပ်ပါမသွားပါစေလတံ့သောအရာကို URL ကိုမှတ်ရန်နှင့်ပြသပါလိမ့်မည်မဟုတ်ပါ။

မှန်မှန်ကန်ကန် HTML ကိုရေးရန်

တဝဘ်စာမျက်နှာ, အဟိုက်ပါလင့်ခ်ဤကဲ့သို့သောဖတ်သေချာအောင်:

ThoughtCo.com

၏သင်တန်း, "https://www.thoughtco.com/" သင်က hidden ချင်သောအမှန်တကယ် URL ကိုထောက်ပြရန်လိုအပ်ကြောင်းနှင့်သော link ကိုဖော်ပြထားတယ်နဲ့တူ ThoughtCo.com ဆိုစကားလုံးသို့မဟုတ်စာပိုဒ်တိုသင်တို့ဆီသို့ပြောင်းလဲသွားနိုင်ပါတယ်။

ဒီမှာစိတ်ကူးတက်ကြွအတန်းထိထိရောက်ရောက် link ကိုဖုံးကွယ်ဖို့အောက်က CSS နဲ့အသုံးပြုလိမ့်မည်ဖြစ်ပါသည်။

ဒီ CSS ကို Code ကိုသုံးပါ

: အဆိုပါ CSS ကိုကုဒ်တက်ကြွစွာလူတန်းစားဖြေရှင်းရန်နှင့် link ကို click နှိပ်ပြီးအပေါ်မှာအဖြစ်အပျက်, ဤကဲ့သို့သော "အဘယ်သူမျှမ" ဖြစ်သင့်သော browser ကိုရှင်းပြဖို့လိုအပ်ပါတယ်

.active {pointer-ဖြစ်ရပ်များ: none; cursor: default အ; }

သငျသညျ JSFiddle မှာကျော်အရေးယူ၌ဤနည်းလမ်းကိုကြည့်ရှုနိုင်ပါတယ်။ သငျသညျထိုအရပ်၌ CSS ကိုကုဒ်ကိုဖယ်ရှား, အဲဒီနောက်ဒေတာ rerun လျှင်, link ကိုရုတ်တရက်နှိပ်ခြင်းနှင့်အသုံးဝင်သောဖြစ်လာသည်။ အဆိုပါ CSS ကိုလျှောက်ထားသည်မဟုတ်သောအခါ, link ကိုပုံမှန်အားဖြင့်ပြုမူထားလို့ဖြစ်ပါတယ်။

မှတ်ချက်: အသုံးပြုသူစာမျက်နှာ၏ source code ကိုရှုမြင်ပါလျှင်, ထိုသူတို့ link ကိုတွေ့မြင်ပါလိမ့်မယ်ဒါကြောင့်ကျနော်တို့အထက်တွေ့မြင်လိုပဲ code ကိုရှိနေတုန်းပဲဖြစ်ပါတယ်ဘာဖြစ်လို့လဲဆိုတော့ဒါဟာရုံ သုံး. မရပါဘယ်နေရာရောက်သွားတယ်ဆိုတာကိုအတိအကျသိသောသတိရပါ။

အဆိုပါ Link ကို & # 39 ကိုပြောင်း; s ကိုအရောင်

ဧည့်သည်များကတကယ်တော့သူတို့ကိုမြင်သူတို့ go ဘယ်မှာသိနိုငျနိုင်အောင်ပုံမှန်အားဖြင့်တစ်ဦးကို web ဒီဇိုင်နာ hyperlink များနောက်ခံထက်ကွဲပြားခြားနားသောအရောင်စေမည်။ သို့သော်ကျနော်တို့ဒါရဲ့စာမျက်နှာ၏ကိုက်ညီဖို့အရောင်ကိုပြောင်းလဲဖို့ဘယ်လိုကြည့်ရှုကြကုန်အံ့, လင့်များဖျောက်ရန်ဒီနေရာကိုပါပဲ။

တစ်ဦးမိမိစိတ်ကြိုက်အတန်းအစားသတ်မှတ်

ကျွန်တော်အပေါ်ကပထမနည်းကနေတူညီတဲ့ဥပမာကိုသုံးပါလျှင်, ငါတို့သည်ရိုးရှင်းစွာသာအထူးလင့်များဝှက်ထားလျက်ရှိသောဒါလိုခငျြသမြှကိုမှအတန်းပြောင်းလဲနိုင်သည်။

ကျွန်တော်တစ်ဦးလူတန်းစားကိုသုံးပါနှင့်အစားအောက်တွင်ဖော်ပြထားသောထံမှတိုင်း link ကိုဖို့ CSS ကိုလျှောက်ထားမပြုခဲ့လျှင်, ထိုသူအပေါင်းတို့သည်ပျောက်ကွယ်သွားလိမ့်မယ်။ ဒါကကျနော်တို့ကဒီမှာအပြီးနေသောအရာကိုမရမယ့်, ဒါကြောင့်ကျနော်တို့ကထုံးစံ hideme class ကိုသုံးမယ့်ဒီက HTML ကုဒ်ကိုသုံးပါလိမ့်မယ်:

ThoughtCo.com

အရောင်အသုံးပြုနည်းအဘယျသို့အထဲက Find

ကျနော်တို့က link ကိုဖုံးကွယ်ထားရန်သင့်လျော်သော CSS ကိုကုဒ်ရိုက်ထည့်မီ, ကျွန်တော်တို့ဟာအသုံးပြုချင်သောအရာကိုအရောင်ထွက်တွက်ဆဖို့လိုပါတယ်။ သငျသညျပြီးသားတစ်ဦးအစိုင်အခဲနောက်ခံရှိပါကအဖြူရောင်သို့မဟုတ်အနက်ရောင်ကဲ့သို့ထိုလွယ်ကူပါတယ်။ သို့သော်အခြားအထူးအရောင်များကိုလည်းအတိအကျဖြစ်ဖို့လိုအပ်ပါတယ်။

သင့်ရဲ့နောက်ခံအရောင် e6ded1 တစ် hex တန်ဖိုးကိုရှိပါတယ်လျှင်ဥပမာ,, သင်စာမျက်နှာများအတွက်စနစ်တကျအလုပ်လုပ်ဖို့ CSS ကိုကုဒ်များအတွက်သင်ကသို့ပျောက်ကွယ်သွားလိုသောနေကွောငျးသိရဖို့လိုအပ်ပါတယ်။

ဤ "အရောင်ရွေးသူ" သို့မဟုတ်မရရှိနိုင် "eyedropper" tools များ, Chrome ဘရောက်ဇာများအတွက် ColorPick Eyedropper ဟုခေါ်ဝေါ်သောတပဒေသာရှိပါတယ်။ အဆိုပါ hex color ကိုရရှိရန်သင်၏ဝဘ်စာမျက်နှာ၏နောက်ခံအရောင်ကိုအမြည်းကကိုသုံးပါ။

ယင်းအရောင်ကိုပြောင်းဖို့အတွက် CSS ကို Customize

အခုဆိုရင်သင်က link ဖြစ်သင့်သောအရောင်ရှိသည်သောက CSS ကိုကုဒ်ရေးသားဖို့, အထက်ကနေကြောင်းနှင့်ထုံးစံလူတန်းစားတန်ဖိုးကိုသုံးစွဲဖို့အချိန်:

.hideme {color: # e6ded1; }

သင့်ရဲ့နောက်ခံအရောင်အဖြူသို့မဟုတ်အစိမ်းရောင်နဲ့တူရိုးရှင်းလျှင်, သင်ကရှေ့တော်၌ထို # နိမိတ်လက္ခဏာကိုသွင်းထားရန်မလိုပါ:

.hideme {အရောင်: အဖြူ; }

ဒီ JSFiddle ၌ဤနည်းလမ်းကိုရဲ့နမူနာကုဒ်ကိုကြည့်ပါ။