Lo sfondo di lavoro per il sito può essere paragonato allo sfondo del desktop del tuo sistema operativo. Sfondo (sfondo), puoi creare diverse varianti, che verranno discusse di seguito.
Necessario
Modifica del file style.css
Istruzioni
Passo 1
Sfondo monocromatico. Il tipo di sfondo più semplice, un grande vantaggio è il caricamento minimo della pagina utilizzando un'immagine del genere. Se il file di stile (style.css) non contiene comandi che impostano il colore di sfondo, il browser suggerisce il bianco per impostazione predefinita. Usa il comando background-color per cambiare il colore. Un esempio di utilizzo di questo comando: background-color: # 3366CC.
Passo 2
Per selezionare un colore specifico, puoi utilizzare un software speciale, ad esempio l'editor grafico Adobe Photoshop. Se non hai mai lavorato con esso, si consiglia di utilizzare i servizi web. Un esempio lampante è il motore di ricerca "Yandex", vai al seguente link https://yandex.ru e inserisci la frase "colore blu". Apparirà una tabella di colori di fronte a te, in cui puoi sceglierne uno a tuo piacimento, copiare il codice e incollarlo nel codice del sito.
Passaggio 3
Trama di sfondo. Oltre al colore di sfondo, puoi aggiungere un'immagine o un motivo ripetuto ciclicamente (trama) a qualsiasi pagina del tuo sito. Per fare ciò, dopo aver inserito il colore di sfondo, scrivi il comando background-image, ad esempio background-image: url (img / uzor.png). Il percorso del file deve essere specificato tra parentesi. Vale la pena notare che la risoluzione della trama può iniziare dalla più piccola (16x16) e terminare con immagini a dimensione intera per la dimensione delle pagine del sito (800x600 e oltre).
Passaggio 4
Sfondo utilizzando un gradiente. In questo caso, stai usando il colore di sfondo che è stato impostato con il comando background-color, ma creando una sfumatura. Il gradiente può essere orizzontale (x) e verticale (y). Molto spesso, una posizione orizzontale viene utilizzata come sfumatura di sfondo, quindi la linea con la sfumatura sarà simile a questa: background-repeat: repeat-x.