Hvordan få et bilde til å gjenta med CSS som innhold legges

May 17

Når du viser et bilde som bakgrunn på nettstedet ditt, vises bildet bare en gang bak teksten på siden din. Dette nonrepeat problemet oppstår når du setter grafikken med HTML; Men ved hjelp av CSS gir stedet deg kontroll over hvordan bildet duplikater. Bruk datamaskinens tekst editor for å gå inn i CSS-koden som trengs for å få et bilde til å automatisk gjenta så du legge til innhold.

Bruksanvisning

1 Last opp bakgrunnsbildet til din Web vert i samme mappe eller katalog hvor ditt nettsted filer blir funnet. Spill URL-adressen til bildet ditt - for eksempel "http://www.site.com/images/background.gif."

2 Start din tekst editor programvare og få opp nettsiden dokument som har det bildet du vil gjentas.

3 Skriv inn følgende CSS-kode etter begynnelsen "<head>" tag:

</ Style>

4 Skriv "body {}" mellom stilelementer for å lage en regel som styrer den generelle utseendet på siden din. Skriv "background-image: URL ( '');" inne i klammeparenteser og skriv inn URL-adressen til grafikken, som i følgende eksempel:

body {background-image: URL ( 'http://www.site.com/images/background.gif'); }

5 Skriv "background-repeat:;" inne i parentesene og type "gjenta" som verdi. Alternativt, skriv "gjenta-x" etter background-repeat egenskap å spesifisere du bare vil at bildet skal kopiere horisontalt, eller skriv "repeat-y" for å instruere det å bare vise vertikalt. Å illustrere:

body {background-repeat: repeat; }

6 Lagre filen og laste den tilbake til verten. Din ferdig CSS ser ut som dette eksempelet:

body {background-image: URL ( 'http://www.site.com/images/background.gif');

background-repeat: repeat;

}

</ Style>