Nwlapcug.com


Come fare un soggiorno di sfondo sul lato sinistro in CSS

Immagine di sfondo di una pagina Web di posizionamento è come arte, nonché un'attività di programmazione. Sfondi ben piazzate possono trasformare una pagina comune in un'opera d'arte. Progettisti di siti, ad esempio, possono utilizzare fogli di stile CSS per posizione immagini di sfondo da nessuna parte che, come su una pagina. Molti proprietari di siti mantenere loro sfondi al centro delle loro pagine, per creare un look unico "decentrato", utilizzare i CSS per ancorare la vostra priorità bassa sul lato sinistro del browser.

Istruzioni

1

Aprire un documento di pagina Web utilizzando blocco note o un editor HTML.

2

Individuare il tag "< head >" di apertura del documento e incollare il seguente codice CSS dopo quel tag:

< style type = "text/css" >

corpo

{background:URL('My_Image.jpg');

background-repeat: no-repeat;

background-attachment: fisso;

background-position: lasciato in alto;

margin-left: 10px;

margin-top: 10px;

}

< / stile >

Queste proprietà CSS definiscono il corpo immagine di sfondo, posizione e i margini. Valore della proprietà background-attachment è "fisso" in questo esempio. Se si desidera l'immagine di sfondo per spostare verticalmente quando gli utenti scorrere la pagina, cambiare "fisso" per "scorrere". La proprietà "background-position" posiziona l'immagine sul lato superiore sinistro della pagina Web. Modificare la parola "top" al "centro" per mantenere l'immagine centrata sul lato sinistro del browser. Modificare "top" a fondo per rendere l'immagine rimangono in basso a sinistra del browser. Il "margin-left" e "margin-top" valori - in pixel - definiscono le immagini di sfondo a sinistra e top margini. Modificare tali valori in qualcosa che ti piace.

3

Individuare "My_Image", jpg"nel codice CSS definito nel passaggio precedente. Sostituirlo con il nome di un'immagine sul disco rigido. Ad esempio, per utilizzare "C:\Images\Tree.jpg" come il vostro sfondo, rendere la dichiarazione di sfondo: URL appaiono come segue:

background:URL('C:\Images\Tree.jpg');

È anche possibile utilizzare un URL invece di un nome di file se l'immagine si trova sul Web.

4

Salvare il documento e avviare il browser. Aprire il Web e l'immagine di sfondo verrà visualizzato sul lato sinistro della pagina.

Consigli & Avvertenze

  • Valori di esperimento con il "margin-left" e margin-right"definiti nel CSS. Queste proprietà consentono un controllo preciso sopra dove l'immagine di sfondo viene visualizzata sul lato sinistro della pagina Web. Se l'immagine appare vicino alla parte superiore della pagina, aumentare il valore di "margin-top" per spostare l'immagine un po ' giù. Aumentare la distanza tra l'immagine e il lato sinistro della pagina aumentando il valore di "margin-left."