Hvordan lage bakgrunn kontrast på nettsider

Hvordan lage bakgrunn kontrast på nettsider


Hvis du vil at hver del av websiden å skille seg ut, vurdere å opprette en bakgrunn kontrast på nettstedet ditt. Denne kontrasten gjør designelementer, som for eksempel bakgrunnsfarge og font, forskjellig i hver side element som overskriften og hoveddelen. Cascading Style Sheets (CSS) gir deg muligheten til å formatere stiler for hvert element som du vil. Bruk datamaskinens tekst editor program for å lage bakgrunns kontraster som kaller oppmerksomhet til seg selv.

Bruksanvisning

1 Ta opp en teksteditor programmet og opprette en ny side. Klikk Fil-menyen "Lagre som" for å nevne dokumentet og lagre det med CSS filtype (for eksempel, styles.css).

2 Skriv inn ID-regler for elementene på siden din som viser en bakgrunn. Vanlige seksjoner inkluderer header, bunntekst og hovedinnhold området. Å illustrere:

header {} bunntekst {} viktigste {}

3 Skriv "background-color:;" mellom klammeparenteser for hver regel, og oppgi en distinkt heksadesimale fargeverdien etter hvert attributt. For eksempel:

header {background-color: # 0000ff; } Footer {background-color: # 00FFFF; } Hoved {background-color: # ffffff; }

4 Skriv "font-size:;" i hver stil og skriv inn en verdi i piksler (px) for å bestemme størrelsen på teksten hver del. For eksempel:

header {font-size: 40px; } Footer {font-size: 10px; } Hoved {font-size: 14px; }

5 Lagre CSS-fil, og laste det opp til Web vert i det samme området der du holder nettstedets hovedindeksen fil. Åpne en nettside dokument i en teksteditor.

6 Plasser markøren før slutt </ head> elementet, og skriv følgende for å bruke stilark til side:
<Link rel = "stylesheet" type = "text / css" href = "styles.css" />

Gjenta denne prosessen på hver nettside dokumentet du foretrekker.

7 Lagre ditt nettsted dokumentet, og laste det opp til Web vert å publisere bakgrunnen kontrast.

Hint

  • En ID i CSS navn stiler et bestemt område på siden din. For å opprette en ID, skriv inn et nummertegn etterfulgt av en periode på ditt valg og skriv et par klammeparentes på slutten (for eksempel #header {}).
  • Separer hvert attributt i CSS-regel med et semikolon. Å illustrere:
  • #header {background-color: # 0000ff; font-size: 40px; }