Hvordan høydepunkt med farger i CSS

Cascading Style Sheets lar webdesignere å endre forgrunn og bakgrunn farger av HTML-elementer. Selv om det ikke er kjent, kan du også bruke CSS til å endre bakgrunnsfargen nettleseren vises når du bruker musen til å markere tekst. Dette trikset gir en ekstra spesiell touch til design og kan til og med gjøre dem mer brukbare i enkelte scenarier. Endre høydepunkt farge krever CSS3, skjønt. Siden ikke alle nettlesere støtter CSS3, bør du forvente at eldre nettlesere vil fortsatt vise standardfremhever fargen.

Bruksanvisning

1 Åpne hoved CSS-fil for nettstedet i en kode editor. Hvis nettstedet ditt ikke bruker en, oppretter du den nå og legge til følgende kode under <title> -taggen av nettstedet:

<Link rel = "stylesheet" type = "text / css" href = "sti / til / yourstyle.css" />

Hvis du kodet ditt nettsted for å bruke en header fil for hele området, så trenger du bare å legge til at koden til topptekstfilen. I tilfelle av en statisk HTML-side, må du legge til denne linjen med kode til hver HTML-fil.

2 Legg til følgende kode i CSS-filen for å kontrollere fremheve fargen:

:: utvalgs {background: # ff5e99; }

:: - Moz-utvalget {background: # ff5e99; }

: utvalgs {background: # ff5e99; }

De to første er leverandørspesifikke kodelinjer for hva CSS3 spesifikasjoner kaller "valg psuedo-klasse." WebKit-baserte nettlesere Chrome og Safari bruker den første kodelinje, som i dette tilfellet gir en ekstra kolon. Firefox bruker andre linje med kode, noe som gir en ekstra kolon og "-moz" leverandør prefiks. Det siste eksempelet er koden som skal fungere når nettlesere blir fullt CSS3-kompatibel, men som i 2011 er dette ennå ikke er tilfelle.

3 Endre seks tegn etter skigard til heksadesimale fargeverdien av ditt valg. Bruk en fargevelger eller fargekart, både tilgjengelig gratis på nettet. Du kan også bruke fargenavn som "svart" eller "hvit" for grunnleggende farger, men du bør oppsøke et diagram for dem, også.

4 Legg IDer eller klasse navn til HTML-koder og deretter målrette dem i CSS til å bruke forskjellige markerings farger på ulike elementer av websidene dine. Her er et eksempel på et avsnitt satt med en klasse navnet "grønn":

<P class = "green"> Grønn tekst ... </ p>

Du kan legge til navnet klassen "grønn" til så mange koder som du liker. Bruk ID når du ønsker å målrette bare én kode, for eksempel en bestemt <p> tag på en webside.

5 Legg klassenavnet eller ID til CSS for å målrette en bestemt kode eller gruppe av koder. For å gjøre avsnittene gitt en klasse navnet "grønn" en grønn utheving farge, bruker du følgende:

p.green :: utvalg {background: # 00FF00; }

p.green :: - moz-utvalget {background: # 00FF00; }

p.green: valg {background: # 00FF00; }

Hint

• Match utheving farge til fargepaletten på nettstedet ditt for å gi den en mer "trukket-sammen" utseende.
• Lek deg med farger for å få mest mulig lesbar kombinasjon av nettstedet bakgrunn, høydepunkt farge og tekstfarge.