Saznajte jednostavan način za uklanjanje podcrtava od veza u HTML-u

Koraci za uklanjanje podcrtavaju iz tekstualnih veza i pitanja kako bi bili svjesni

Prema zadanim postavkama tekstualni sadržaj koji je povezan s HTML-om pomoću elementa ili "sidro" oblikovan je podcrtom. Često, web dizajneri odluče ukloniti ovaj zadani stil uklanjanjem podcrta.

Mnogi dizajneri ne brinu o izgledu podcrtavanog teksta, posebno u gustim blokovima sadržaja s puno veza. Sve te podcrtane riječi mogu stvarno razbiti čitanje teksta dokumenta. Mnogi su tvrdili da ta podrijetla zapravo čine riječi teže razlikovati i čitati brzo zbog načina na koji podcrtava promjene prirodnih slovnih oblika.

Međutim, postoje legitimne koristi za zadržavanje tih podcrtava na tekstualnim vezama. Na primjer, kada pregledavate velike blokove teksta, podvučene veze povezane s pravim kontrastom boja olakšavaju čitateljima da odmah pregledaju stranicu i vide gdje su veze. Ako pogledate članke o web dizajnu ovdje na About.com, kao i druge članke na web mjestu, vidjet ćete ovaj stil podcrtanih veza na mjestu.

Ako odlučite ukloniti veze iz teksta (jednostavan postupak koji ćemo kratko pokriti), svakako pronađite načine za stiliranje tog teksta kako biste još uvijek razlikovali ono što je veza od onoga što je običan tekst. To se najčešće provodi s gore navedenim kontrastom boja, ali sama boja može predstavljati problem za posjetitelje s oštećenjem vida poput sljepoće boja. Ovisno o njihovom posebnom obliku sljepoće boja, kontrast se može potpuno izgubiti na njima, sprečavajući im da vide razliku između povezanog i nepovezanog teksta. Zato je podcrtani tekst još uvijek smatra najboljim načinom prikazivanja veza.

Pa kako onemogućiti naglasak ako i dalje želite to učiniti? Budući da je ovo vizualna karakteristika o kojoj se brinemo, okrenut ćemo se dijelu našeg web mjesta koji obrađuje sve stvari vizualno - CSS.

Koristite Cascading Style Sheets da biste isključili podvlake na vezama

U većini slučajeva ne želite pretvoriti podcrtavanje samo jedne tekstualne veze. Umjesto toga, vaš stil dizajna vjerojatno vam zahtijeva uklanjanje podcrtava svih veza. To biste učinili dodavanjem stilova na svoj vanjski stilski list.

{text-decoration: none; }

To je to! Ta jedna jednostavna linija CSS-a isključit će podcrtavanje (koja zapravo koristi CSS svojstvo za "text-decoration") na svim vezama.

Također možete dobiti više specifičnih s ovim stilom. Na primjer, ako želite samo isključiti podcrtavanje ili veze unutar elementa "nav", mogli biste pisati:

nav a {text-decoration: none; }

Sada će tekstualne veze na stranici dobiti zadani podsjetnik, ali one u navu bi ga uklonile.

Jedna stvar koju mnogi web dizajneri odluče učiniti jest vratiti vezu natrag na "kada" netko prebaci preko teksta. To će biti učinjeno pomoću: hover CSS pseudo-klase, ovako:

{text-decoration: none; } a: lebdjeti {text-decoration: underline; }

Upotreba Inline CSS-a

Kao alternativa uvođenju izmjena na vanjski stilski stil, možete dodati stilove izravno na element u HTML obliku, kao što je ovaj:

ta veza nema podcrtavanje

Problem s ovom metodom je taj što stavlja informacije o stilu u vašu HTML strukturu, što nije najbolja praksa. Stil (CSS) i struktura (HTML) trebao bi biti odvojen.

Ako biste htjeli da sve veze s tekstom web mjesta imaju ukloniti podcrtanu oznaku, dodavanjem tih podataka o stilu na svaku vezu na pojedinačnoj osnovi, to bi značilo da se dodatni broj dodatnih oznaka dodaje kodu vaše web-lokacije. Ova blokada stranica može usporiti vrijeme učitavanja stranice i učiniti cjelokupnu upravljivost stranica mnogo zahtjevnijom. Iz tih razloga, poželjno je da se uvijek obratite vanjskom listu stilova za sve potrebe za oblikovanjem stranica.

U zatvaranju

Jednostavno kao ukloniti podcrtavanje s tekstualnih linkova web stranice, trebali biste imati na umu i posljedice toga. Iako može doista očistiti izgled stranice, to može učiniti na štetu cjelokupne upotrebljivosti. Uzmite u obzir sljedeći put kad razmislite o promjeni svojstava "tekstnog ukrasa" stranice.

Izvorni članak Jennifer Krynin. Uredio je 19.9.196. Jeremy Girard