Hvordan Lage En Gummibakgrunn

Innholdsfortegnelse:

Hvordan Lage En Gummibakgrunn
Hvordan Lage En Gummibakgrunn

Video: Hvordan Lage En Gummibakgrunn

Video: Hvordan Lage En Gummibakgrunn
Video: Perfect HomeMade Donuts Recipe دونات خانگی ، Easy Donut , How To Make Doughnuts 2024, November
Anonim

Når du oppretter din egen nettside, vil du naturligvis at den skal vises så attraktivt som mulig, uavhengig av brukerens nettleserversjon. Spesielt slik at bakgrunnsbildet strekkes og justeres til dataskjermens oppløsning.

Hvordan lage en gummibakgrunn
Hvordan lage en gummibakgrunn

Det er nødvendig

ferdigheter i å jobbe med html, css, java-script

Bruksanvisning

Trinn 1

Åpne koden for nettstedet ditt i en hvilken som helst redaktør, for eksempel Notisblokk eller et eget webdesignprogram, Dreamweaver. Lim inn følgende linjer i koden for å strekke bakgrunnen til nettstedet. Legg til bakgrunn: url (‘Sett inn en lenke til bildet’).

Steg 2

For å størrelse bildet horisontalt, bruk følgende kode: Bakgrunn: url (‘Sett inn en lenke til bildet’ repeter-x), vertikalt - erstatt x med y på slutten av koden. Hvis nettstedet er utformet i en css-fil, limer du inn koden i den. På denne måten vil du kunne legge en gummibelagt bakgrunn på nettstedet ditt.

Trinn 3

Bruk følgende kodeeksempel for å plassere et bakgrunnsbilde på en side og automatisk strekke det for å passe til skjermoppløsningen som siden vises på. Eksempelkode: body {bakgrunn: "Sett inn en lenke til bakgrunnsbildet" () fast venstre senter uten gjenta. deretter bakgrunnsstørrelse: […].

Trinn 4

For å strekke bakgrunnsbildet, bare sett inn et bilde som bakgrunn og sett bredden til 100%. Sett for eksempel inn følgende tekst i sidekoden: bakgrunnsbilde "alt =" Skriv inn navnet på bildet "/>. Dermed vil den brukes til å passe til bredden på bildet, men proporsjonene vil bli krenket.

Trinn 5

På samme måte kan du sette bildet til å strekke seg i høyden, bruke høyde i stedet for breddeattributtet. Eller bruk følgende kodeeksempel for css: bakgrunnsbilde av nettstedet) "> og etter det legger du til 100% bredde på bildet som i forrige eksempel. Du kan også bruke skriptet til å finne ut brukerens skjermoppløsning og redigere størrelsen av bordet ditt for det.

Anbefalt: