Hvordan man har en GIF-fil som baggrundsbillede

July 1

En GIF-fil indeholder et billede komprimeret til brug på internettet. Nogle GIF billeder er animeret, og vil automatisk afspillet, når indlejret i en webside. En GIF billede kan bruges som baggrundsbillede på en webside. Du kan styre sin fliser, placering og rulle adfærd på webside ved hjælp af inline CSS kode i en almindelig HTML-dokument.

Instruktioner

1 Placer følgende kode mellem <head> tags i dit HTML-dokument, der erstatter "BILLEDER / FILE.GIF" med stien til GIF-fil:

<Style type = "text / css">

legeme

{

background-image: URL ( "BILLEDER / FILE.GIF");

}

</ Style>

2 Tilføj følgende linje under "background-image" linje for at fjerne fliser adfærd baggrundsbilledet:

background-repeat: no-repeat;

Brug "repeat-x" eller "repeat-y" i stedet for "no-repeat" til flise billedet vandret eller lodret, henholdsvis.

3 Brug følgende kode til at placere GIF i midten af ​​baggrunden på siden:

background-position: center center;

Brug "venstre top", "venstre center", "venstre bund", "højre top", "højre center", "højre bund", "center top" eller "center bund" for at placere billedet langs kanterne eller i hjørner af siden. Brug pixelkoordinaterne eller procentdele placere billedet vilkårligt. For eksempel vil denne linje placere billedet 100 pixels fra toppen af ​​siden, flugter med venstre side:

background-position: 0px 100px;

De positionering typer kan blandes sammen så godt. For eksempel vil følgende linje centrere billedet vandret, en tredjedel af sidens højde fra toppen:

background-position: center 33%;

4 Ret den rulle opførsel af GIF med "background-attachment" ejendom. Der er kun én mulighed for denne egenskab; bruge denne linje til at forårsage baggrundsbilledet at forblive på plads, når siden rulles, skaber en interessant visuel effekt:

background-attachment: fast;

5 Eksperimenter med forskellige kombinationer af de egenskaber, der er vist ovenfor til fuldt ud at forstå effekten af ​​hver på baggrundsbilledet på din side.