Kuidas muuta linki veebisaidil

Eemalda Link Underlines või Create Dashed Dotted või Double Underlined Links

Vaikimisi on veebibrauseritel teatud CSS-stiile, mida nad kasutavad konkreetsete HTML-elementide jaoks. Kui te ei kirjuta neid vaikeväärtusi oma saidi enda stiililehtedega, siis kehtivad vaikeseaded. Hüperlinkide puhul on vaikimisi kuvamisstiiliks see, et kõik lingitud tekst on sinist ja allajoonitud. Brauser teeb seda nii, et saidi külastajad saavad hõlpsalt näha, milline tekst on lingitud. Paljud veebidisainerid ei hooli neist vaikimisi kasutatavatest stiilistest, eriti need, mida rõhutatakse. Õnneks on CSS-i abil lihtne rõhutada nende välimust või eemaldada need täielikult.

Allajooni eemaldamine tekstilingidel

Allajoonitud tekst võib olla keerulisem lugeda seda teksti, millele pole rõhutatud. Lisaks sellele ei tegele paljud disainerid lihtsalt paberil olevate tekstilinkide välimusega. Nendel juhtudel soovid teid tõenäoliselt neid rõhuasetusi täielikult eemaldada.

Tekstiühenduste all olevate elementide eemaldamiseks kasutate CSS-i vara tekstivärve. Siin on CSS, mille kirjutad selleks:

{teksti-kujundus: pole; }

Selle ühe CSS-i rida eemaldaksite alljooni kõigist tekstilinkidest. Kuigi see on väga üldine stiil (see kasutab elemendi valijat), on see veel spetsiifilisem kui vaikimisi brauserite stiilid. Kuna need vaikestiilid loovad algusjooned alustamiseks, on see just see, mida peate üle kirjutama.

Hoiatus kõrvaldamise kohta rõhutab

Visuaalselt võib rõhuasetuse eemaldamine olla täpselt see, mida soovite saavutada, kuid te peaksite seda ka ettevaatlikult tegema. Kas sulle meeldib allkirjastatud linkide välimus või mitte, ei saa te väita, et nad teevad selgeks, milline tekst on lingitud ja milline mitte. Kui võtate ära rõhutavad või muudate selle vaikimisi kasutatava sinise lingi värvi, peate tagama, et asendate need stiilidega, mis võimaldavad lingitud teksti endiselt välja paistma. See muudab teie saidi külastajate jaoks intuitiivsema kogemuse.

Ärge rõhutage mitte-lingid

Veel üks hoiatus lingidest ja rõhutades, ärge rõhutage teksti, mis ei ole lingiks selle rõhutamiseks. Inimesed on jõudnud eeldusele, et paberil olev tekst on lingiks, nii et kui rõhutate rõhutamiseks rõhutatult sisu (selle asemel, et muuta see paksuks või selle suuna juhuks), siis saadate vale sõnumi ja segadusse saidi kasutajad.

Muutke Allajooni punktidesse või kriipsudesse

Kui soovite hoida oma tekstlüli alla, kuid muutke selle rõhutatult stiili, mis on vaikimisi ilme, mis on "sõdur", saate seda ka teha. Selle kindla rea ​​asemel võite oma lingid rõhutada punktidega. Selle tegemiseks eemaldate ikkagi allrõnga, kuid asendate selle piiri põhja stiili omadustega:

{teksti-kujundus: pole; border-bottom: 1px dotted; }

Kuna olete eemaldanud standardse alampiiri, on punktiirjanumber ainuke, mis kuvatakse.

Saate teha samu asju, et saada kriipsu. Lihtsalt muutke piirjoone stiili katkendlikuks:

{teksti-kujundus: pole; border-bottom: 1px graafiline; }

Alla värvi muutmine

Teine viis, kuidas juhtida tähelepanu oma lingile, on muuta rõhu all oleva värvi. Lihtsalt veenduge, et värv sobiks teie värviskeemiga .

{teksti-kujundus: pole; border-bottom: 1px tahke punane; }

Topelt rõhutab

Topeltõhu kasutamise trikk on see, et peate muutma piiri laiust. Kui loote 1-pikkuse laiusega piiri, saate lõpuks kahekordse allrida, mis näeb välja nagu üks allrükk.

{teksti-kujundus: pole; border-bottom: 3px double; }

Te saate kasutada ka olemasolevat allkirtimist, et kahekordse rõhuasetusega teha muid funktsioone, näiteks üks punktidel olevatest joontest:

{border-bottom: 1px topelt; }

Ära unusta liitriike

Võite lisada piiri põhja stiili oma lingid erinevates riikides, näiteks: hõljumine: aktiivne või: külastatud. See võib tekitada külastajatele meeldiva "ülemineku" stiili, kui kasutate seda "hover" pseudoklassi. Teise punktiirjoone alamridu tegemiseks ilmub siis, kui kurssi lingi kohal:

{teksti-kujundus: pole; } a: hover {border-bottom: 1px dotted; }

Jennifer Krynini algne artikkel. Redigeeris Jeremy Girard