Hvordan lage bakgrunner i CSS3 - dummies

De fleste sidene du ser på, har en slags bakgrunn. Følgende fremgangsmåte viser hvordan du legger til en bakgrunn ved hjelp av CSS3, som du kan bruke til å gjøre websiden din mer appellerende til en besøkende.

1. Opprett ExternalCSS. HTML og ExternalCSS. CSS-filer og kopier dem til en ny mappe.

2. Lag eller hent et bakgrunnsbilde i Joint Photographic Experts Group (JPEG) format og gi det navnet Bakgrunn. JPG.

3. Åpne ExternalCSS. CSS.

4. Skriv inn følgende kode etter eksisterende stiler og lagre endringene på disken.

   kropp {bakgrunnsbilde: url ("Bakgrunn. JPG"); bakgrunnsstørrelse: 100%; bakgrunnsrepetisjon: nei-gjenta;}
   

   Det vanligste stedet å bestille bakgrunnsbilder er i. Imidlertid hindrer ingenting deg i å bruke bakgrunner i andre objekter og på forskjellige andre måter.

   Utgangspunktet for de fleste bakgrunner er bakgrunnsbildeegenskapen der du kan angi bildet du vil bruke med url () -metoden. Det er mulig å legge til flere bilder i bakgrunnen. Hvis du gjør det, kombinerer nettleseren bildene til en enkelt presentasjon.

   Bruken av egenskapen bakgrunnsstørrelse bestemmer hvor stor bildet vises på skjermen. Eksemplet er et stort bilde, så du vil at den skal ta opp hele visningsområdet. Ved å bruke 100% som verdien betyr at bildet automatisk endres for å ta opp hele klientområdet.

   Du bruker bakgrunnsreferanseegenskapen til å avgjøre om bildet gjentar i bakgrunnen. Det er vanlig at små bilder gjentas, slik at de tar opp hele visningsområdet. Gjenta et stort bilde har en tendens til å få bakgrunnen til å forvirre og forringe det generelle utseendet på skjermen.

5. Oppdater testsiden.

   Du ser effekten av å gjøre stilendringen.

   

6. Endre størrelse på nettleservinduet.

   Du ser at bakgrunnsbildet automatisk endres for å ta opp hele visningsområdet.