Hvordan Input Scalable CSS bakgrunner med PNG

En skalerbar bakgrunn for et nettsted er en som automatisk endrer størrelsen å være større eller mindre avhengig av skjermoppløsningen personer som ser siden din bruker, alltid fylle helhet på siden. Du kan enkelt sette en skalerbar bakgrunn for nettstedet ditt ved hjelp av en høy kvalitet PNG-bilde og "background-size" CSS 3 eiendom, støttet av nyere versjoner av alle moderne nettlesere.

Bruksanvisning

1 Opprett eller finn en passende bakgrunnsbilde i PNG-format. Jo større bildet er, desto bedre: bildet vil redusere til en mindre størrelse jevnt, men kan se kornete eller uklare når de forstørres utover sin faktiske størrelse.

2 Last opp bildet til nettstedet ditt, gjør et notat av nettadressen.

3 Bestem hvordan bakgrunnen skal være innrettet på nettstedet, både vertikalt og horisontalt. Du kan justere bakgrunnen på toppen, midten eller nederst på siden vertikalt, og på venstre, midtre eller høyre på siden horisontalt.

4 Legg til følgende kode i CSS stilark, erstatte "IMAGE_URL" med nettadressen til bakgrunnsbildet, "vertikal" med din valgte vertikal justering og «horisontal» med din valgte horisontal justering:

html {
bakgrunn: url ( "IMAGE_URL") no-repeat vertikal horisontal fast;
background-size: dekke;
}