Come creare una foto di sfondo in CSS

August 31

Cascading Style Sheets (CSS) è il codice che funziona con il HyperText Markup Language (HTML) per lo stile le pagine Web. Questo codice CSS è costituita da regole di stile che dirigono il browser su come visualizzare il contenuto. Il codice CSS controlla molte cose, come ad esempio i margini dimensione del carattere e pagina. Inoltre, si ha la possibilità di applicare una foto per la tua pagina in modo che lo sfondo viene visualizzata questa immagine. È possibile utilizzare il programma editor di testo del computer per creare una foto di sfondo CSS per il tuo sito.

istruzione

1 Accedere a un file gratuito o un host di immagini, come ad esempio MediaFire o TinyPic, e seguire le istruzioni sullo schermo per caricare la vostra foto (vedi Risorse). Copiare l'indirizzo URL che visualizza dopo aver completato il processo di caricamento (ad esempio, "http://www.host.com/photo.jpg"). Un host consente l'immagine di essere visto in una pagina Web.

2 Aprire il programma di editor di testo (Blocco note di Windows, nella cartella Accessori) e aprire un nuovo documento. Tipo "corpo" e inserire una serie di parentesi graffe per creare la regola CSS corpo che controlla l'aspetto generale della pagina. Per esempio:

body {}

3 Inserire "background-image: url ( '');" tra le staffe regola corpo in questo modo:

body {background-image: url ( ''); }

4 Digita l'URL del tuo immagine tra le virgolette singole tra parentesi. Illustrare:

body {background-image: url ( 'http://www.imagehost.com/photo.jpg'); }

5 Salvare il documento con il "css" fine (per esempio, "background.css"). Posizionare il file su un host (come nella fase 1) e registrare l'indirizzo URL.

6 Aprire la pagina Web in cui si desidera che la foto di sfondo nel vostro editor di testo e posizionare il cursore tra le "<head> </ head>" elementi in alto. Inserisci qui un link foglio di stile con il vostro URL del documento CSS dopo la "href =" entry come il seguente esempio:

<Link rel = "stylesheet" type = "text / css" href = "http://www.host.com/style.css" />

7 Salvare il lavoro. La tua foto viene ora visualizzato come sfondo nella pagina Web.