Ako odstrániť podčiarknutia z odkazov

click fraud protection

Predvolene ide o textový obsah prepojené s HTML použitie prvku „alebo kotva“ je štylizované podčiarknutím. Weboví dizajnéri sa často rozhodnú tento predvolený štýl odstrániť odstránením podčiarknutia.

Dôvody pre a proti podčiarknutiu

Mnoho dizajnérov sa nestará o vzhľad podčiarknutého textu, najmä v hustých blokoch obsahu s množstvom odkazov. Všetky tieto podčiarknuté slová môžu skutočne narušiť tok čítania dokumentu. Mnohí tvrdia, že tieto podčiarknutia v skutočnosti sťažujú rozlíšenie a rýchle čítanie slov kvôli spôsobu, ktorým podčiarknutie mení prirodzené tvary písmen.

Zachovanie týchto podčiarknutí na textových odkazoch má však legitímne výhody. Napríklad keď prechádzate veľkými blokmi textu, podčiarknuté odkazy spojené so správnym farebným kontrastom uľahčia čitateľom okamžité naskenovanie stránky a zistenie, kde sú odkazy.

Ak sa rozhodnete odstrániť odkazy z textu (jednoduchý proces, ktorému sa čoskoro budeme venovať), určite nájdete spôsoby, ako tento štýl upraviť, aby ste stále odlíšili to, čo je odkaz, od toho, čo je obyčajný text. Najčastejšie sa to robí pomocou

instagram viewer
farebný kontrast, ale samotná farba môže predstavovať problém pre návštevníkov so zrakovým postihnutím, ako je napríklad farebná slepota. V závislosti od ich konkrétnej formy farebnej slepoty sa na nich môže úplne stratiť kontrast, ktorý im bráni vidieť rozdiel medzi prepojeným a neprepojeným textom. Preto sa podčiarknutý text stále považuje za najlepší spôsob zobrazovania odkazov.

Ako teda vypnúť podčiarknutie, ak tak stále chcete urobiť? Pretože sa jedná o vizuálnu charakteristiku, ktorá nás zaujíma, obrátime sa na časť nášho webu, ktorá spracováva všetky vizuálne prvky - CSS.

Na vypnutie podčiarknutia v odkazoch použite kaskádové štýly

Vo väčšine prípadov sa snažíte vypnúť podčiarknutie iba na jednom textovom odkaze. Namiesto toho bude pravdepodobne potrebné, aby ste zo všetkých odkazov odstránili podčiarknutia. Urobili by ste to pridaním štýlov do súboru externá štýlová tabuľa.

a {
dekorácia textu: žiadny;
}

To je všetko! Ten jeden jednoduchý rad CSS by vypol podčiarknutie (ktoré v skutočnosti používa vlastnosť CSS na „dekoráciu textu“) na všetkých odkazoch.

Týmto štýlom by ste mohli získať viac konkrétnych informácií. Ak by ste napríklad chceli vypnúť iba podčiarknutie alebo odkazy vo vnútri prvku „nav“, mohli by ste napísať:

nav a
dekorácia textu: žiadny;
}

Teraz by textové odkazy na stránke dostali predvolené podčiarknutie, ale tí v navigácii by to nechali odstrániť.

Jedna vec, ktorú sa mnoho webových dizajnérov rozhodne urobiť, je prepnúť odkaz späť na „zapnutý“, keď niekto umiestni kurzor myši na text. To by sa stalo pomocou: hover Pseudotrieda CSS, Páči sa ti to:

a {
dekorácia textu: žiadny;
}
a: hover {
dekorácia textu: podčiarknutie;
}

Pomocou vloženého CSS

Ako alternatívu k zmenám v externej šablóne štýlov môžete tiež pridať štýly priamo do samotného prvku v HTML.

Problém s touto metódou spočíva v tom, že umiestňuje informácie o štýle do vašej štruktúry HTML, čo nie je najlepší postup. Štýl (CSS) a štruktúra (HTML) by mali byť oddelené.

Ak chcete, aby boli všetky textové odkazy na stránky odstránené podčiarknutie, pridajte túto informáciu o štýle každý odkaz na individuálnom základe by znamenal pridanie značného množstva ďalších značiek na vaše stránky kód. Táto nafúknutá stránka môže spomaliť čas načítania stránok a urobiť celkovú správu stránok oveľa náročnejšou. Z týchto dôvodov je vhodnejšie vždy obrátiť sa na externú šablónu štýlov pre všetky potreby týkajúce sa štýlov stránok.

V záverečnej

Odstránenie podčiarknutia z textových odkazov na webové stránky je ľahké, mali by ste si tiež uvedomiť dôsledky, ktoré to môže mať. Aj keď to môže skutočne vyčistiť vzhľad stránky, môže to byť na úkor celkovej použiteľnosti. Berte to do úvahy, keď nabudúce zvážite zmenu vlastností textovej výzdoby stránky.

instagram story viewer