Sådan ændres Farven På Et Hyperlink

Indholdsfortegnelse:

Sådan ændres Farven På Et Hyperlink
Sådan ændres Farven På Et Hyperlink

Video: Sådan ændres Farven På Et Hyperlink

Video: Sådan ændres Farven På Et Hyperlink
Video: How to Change The Color of Clicked Hyperlinks in Word 2024, Kan
Anonim

Attributten Cascading Style Sheets (CSS) bruges mest til at ændre farven på hyperlinks på websider. Mindre funktionelle løsninger på dette problem findes på HTML-sproget (HyperText Markup Language - "hypertext markup language").

Sådan ændres farven på et hyperlink
Sådan ændres farven på et hyperlink

Er det nødvendigt

Grundlæggende kendskab til HTML- og CSS-sprog

Instruktioner

Trin 1

Forbered en stylingblok til hyperlinks. I sin enkleste form kan det se sådan ud: a {color: Green} Her kaldes "a" en "vælger", hvilket indikerer, at stilbeskrivelsen i parentes skal anvendes på alle link-tags i dokumentet. Grøn definerer linkets farve; dette er en meget grov definition af farve og bruges sjældent. Meget oftere tilføjes en "pseudoklasse" til "a" -vælgeren - det er en etiket, der giver dig mulighed for at specificere stilen på linket i tre forskellige tilstande.

Trin 2

Brug linket pseudoklasse til at style den normale (inaktive) tilstand af linket. Det kan se sådan ud, for eksempel: a: link {color: Green}

Trin 3

Brug pseudoklassen til at angive, hvordan linket skal vises på svævningen. For eksempel: a: hover {color: Lime}

Trin 4

Brug den besøgte pseudoklasse til at beskrive stilen på et allerede besøgt link. For eksempel: a: besøgt {color: DarkGreen}

Trin 5

Kombiner alle tre stater i en stilbeskrivelsesblok. Udseendet af HTML-kode, der indeholder CSS-beskrivelser af typografier, kan for eksempel se sådan ud:

a: link {farve: grøn}

a: besøgt {color: DarkGreen}

a: svæver {farve: Lime}

Her fortæller åbnings- og lukningstags-HTML-tags browseren, hvor typebeskrivelser begynder og slutter, og mellem dem er en beskrivelse af linkadfærden i tre stater.

Trin 6

Eksemplet, der er brugt ovenfor, viser kun farveegenskaberne, men andre attributter kan inkluderes i beskrivelsen. For eksempel, hvis sidedesignet kræver, at linket ikke er understreget i den normale (inaktive) tilstand, men understreget, når markøren holdes over, kan koden ændres som følger:

a: link {farve: grøn; tekst-dekoration: ingen;}

a: besøgt {color: DarkGreen; tekst-dekoration: ingen;}

a: svæver {farve: Lime; tekst-dekoration: understreg;}

Trin 7

Hvis du kun vil ændre farven på nogle links på siden og lade resten være med standardindstillingerne, skal du tilføje klasseattributten til tagget for hvert link, der ændres. Navngiv for eksempel denne hyperlink-klasse newLinks. Derefter kan linktagget se sådan ud: tekstlink Det samme klassenavn skal føjes til stilbeskrivelsen:

a.newLinks: link {farve: grøn; tekst-dekoration: ingen;}

a.newLinks: besøgte {color: DarkGreen; tekst-dekoration: ingen;}

a.newLinks: svæver {farve: Lime; tekst-dekoration: understreg;}

Trin 8

Placer koden til stilbeskrivelse udarbejdet ud fra eksemplerne beskrevet ovenfor i sidehovedet - mellem tags og. Hvis det er nødvendigt, tilføj en klasseattribut til linketags med navnet, der bruges i stilbeskrivelserne. Gem derefter den modificerede side, og proceduren til ændring af hyperlinkets farve afsluttes.

Anbefalede: