Hvordan lage et bakgrunns opphold på venstre side i CSS
Plassere en websidens bakgrunnsbildet er som kunst, samt et programmerings oppgave. Velplasserte bakgrunn kan slå en vanlig side i et kunstverk. Site designere, for eksempel, kan bruke Cascading Style Sheets å posisjonere bakgrunnsbilder noe de liker på en side. Mange nettsted eiere holde sin bakgrunn i sentrum av sidene sine, for å skape en unik "off-center" look, bruk CSS for å forankre din bakgrunn til venstre side av nettleseren.
Bruksanvisning
1 Åpne en webside dokument med Notepad eller en HTML-editor.
2 Finn dokumentet åpnings "<head>" tag, og lim inn følgende CSS-koden etter at tag:
<Style type = "text / css">
kropp
{Background: URL ( 'My_Image.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-posisjon: left toppen;
margin-left: 10px;
margin-top: 10px;
}
</ Style>
Disse CSS egenskaper definerer kroppens bakgrunnsbilde, posisjon og marginer. Bakgrunnen-vedlegg boligens verdi er "fast" i dette eksempelet. Hvis du ønsker at bakgrunnsbildet til å bevege seg vertikalt når brukere bla nedover siden, endring "fast" til "bla". Den "background-position" eiendom plasserer bildet på venstre side av nettsiden. Endre ordet "topp" til "sentrum" for å beholde bildet sentrert på venstre side av nettleseren. Change "top" til bunn for å gjøre bildet forblir i nettleserens venstre hjørne. De "margin-left" og "margin-top" verdier - i piksler - definere bakgrunnsbilder til venstre og øverst marginer. Endre disse verdiene til noe du liker.
3 Finn "My_Image", jpg "i CSS-koden som er definert i forrige trinn Erstatt det med navnet på et bilde på harddisken for eksempel ønsker å bruke.." C: \ Bilder \ Tree.jpg "som bakgrunn, gjør bakgrunnen: URL erklæring se slik ut:
bakgrunn: URL ( 'C: \ Bilder \ Tree.jpg');
Du kan også bruke en URL i stedet for et filnavn hvis bildet ligger på nettet.
4 Lagre dokumentet og starte nettleseren din. Åpne Web og merk at bakgrunnsbildet vises på venstre side av siden.
Hint
- Eksperimenter med "margin-left" og margin-right "verdier som er definert i CSS. Disse egenskapene gir deg presis kontroll over hvor bakgrunnsbildet vises på venstre side av nettsiden. Hvis bildet ser til nær toppen av siden, øke verdien av "margin-top" for å flytte bildet ned litt. Øk avstanden mellom bildet og til venstre på siden ved å øke verdien av "margin-left".