Утойванне сувязі з дапамогай CSS можна зрабіць некалькі спосабаў, але мы разгледзім два метаду, у якіх URL можа быць цалкам схавана ад вачэй. Калі вы хочаце стварыць палявання зборшчыка смецця або велікоднае яйка на вашым сайце, гэта цікавы спосаб схаваць спасылкі.
Першы спосаб складаецца ў выкарыстанні не «не» ў якасці паказальніка падзей CSS значэння ўласцівасці. Іншае проста афарбоўваючы тэкст, каб адпавядаць фону старонкі.
Майце на ўвазе, што ні адзін з метадаў будзе зрабіць спасылку цалкам знікнуць з былі знойдзеныя пры пошуку зыходнага кода. Тым не менш, наведвальнікі не будуць мець просты, просты спосаб, у якім, каб убачыць яго, і вашы наведвальнікі пачаткоўца не будзе мець ні найменшага паняцця, як знайсці спасылку.
Заўвага: Калі вы шукаеце інструкцыі аб тым , як звязаць знешнюю табліцу стыляў, гэтыя інструкцыі не тое , што вы пасля гэтага . См Які ліст Знешні стыль? замест гэтага.
Адключыць Pointer падзея
Першы метад, які мы можам выкарыстоўваць, каб схаваць URL, каб зрабіць спасылку не рабіць нічога. Пры навядзенні паказальніка мышы на спасылку, ён не пакажа, што кропкі URL ў і гэта не дазволіць вам пстрыкнуць па ім.
Напісаць HTML Правільна
Адзін вэб-старонкі, пераканайцеся, што гіперспасылка гучыць так:
ThoughtCo.comВядома, «https://www.thoughtco.com/» неабходна ўказаць фактычны URL , які вы хочаце схаваным і ThoughtCo.com можа быць зменены на любое слова або фразу , якую вы так апісваеце спасылку.
Ідэя заключаецца ў тым, што клас актыўным будзе выкарыстоўвацца ніжэй CSS эфектыўна схаваць спасылку.
Выкарыстаць гэты CSS код
Код CSS павінен звярнуцца актыўным класам і растлумачыць браўзэр, што падзея па спасылцы кліку, не павінна быць «ні адзін», як гэта:
.active {паказальнік падзеі: няма; Курсор: па змаўчанні; }Вы можаце ўбачыць гэты метад у дзеянні над на JSFiddle. Калі вы выдаліце код CSS там, а затым паўторна дадзеныя, сувязь раптам становіцца актыўнай і карыснай. Гэта адбываецца таму, што калі CSS не ўжываецца, спасылка паводзіць сябе нармальна.
Заўвага: Памятаеце , што калі карыстальнік праглядае зыходны код старонкі, яны будуць бачыць спасылку і дакладна ведаць , куды ён ідзе , таму што , як мы бачым вышэй, код ўсё яшчэ там, ён проста не можа выкарыстоўвацца.
Зменіце спасылку & # 39; s Колер
Як правіла, вэб-дызайнер будзе рабіць гіперспасылкі іншага колеру, чым фон, так што наведвальнікі могуць фактычна бачыць іх і ведаць, куды яны ідуць. Тым ня менш, мы тут , каб схаваць спасылкі, так што давайце паглядзім , як змяніць колер , каб адпавядаць старонкі.
Вызначэнне карыстацкага класа
Калі мы будзем выкарыстоўваць той жа самы прыклад з першага метаду вышэй, мы можам проста змяніць клас да таго, што мы хочам, каб толькі спецыяльныя спасылкі схаваныя.
Калі мы не выкарыстоўвалі клас і замест гэтага ўжылі CSS знізу да кожнай спасылцы, то ўсе яны знікнуць. Гэта не тое, што мы пасля гэтага тут, таму мы будзем выкарыстоўваць гэты HTML-код, які выкарыстоўвае карыстацкі клас hideme:
ThoughtCo.comВысветліце Які колер выкарыстоўваць
Перад тым, як ўвесці адпаведны код CSS, каб схаваць спасылку, мы павінны высветліць, які колер мы хочам выкарыстаць. Калі ў вас ёсць салідны вопыт ужо, як белы або чорны, то гэта лёгка. Тым не менш, іншыя спецыяльныя колеру павінны быць дакладнымі таксама.
Напрыклад, калі колер фону мае шаснаццатковае значэнне e6ded1, вы павінны ведаць , што для кода CSS , каб працаваць належным чынам на старонцы вы якая жадае яго знікнуць ст.
Ёсць шмат такіх «выбару колеру» або «піпетка» інструменты даступныя, адзін з якіх называецца ColorPick Піпетку для браўзэра Chrome. Выкарыстоўвайце яго, каб паспрабаваць колер фону вэб-старонкі, каб атрымаць шаснаццатковы колер.
Настройка CSS для змены колеру
Цяпер, калі ў вас ёсць колер, што спасылка павінна быць, прыйшоў час выкарыстоўваць гэта і значэнне карыстацкага класа зверху, каб напісаць код CSS:
.hideme {колер: # e6ded1; }Калі колер фону проста як белы або зялёны, вы не павінны паставіць знак # перад ім:
.hideme {колер: белы; }См прыклад кода гэтага метаду, у гэтым JSFiddle.