Nwlapcug.com


Codice HTML per inserire un'immagine di sfondo in un centro fisso

Codice HTML per inserire un'immagine di sfondo in un centro fisso


Uno sfondo che si inserisce senza problemi con il layout e il contenuto è la chiave per rendere un sito Web dall'aspetto professionale. Per raggiungere questo obiettivo, il corretto posizionamento può essere necessario. L'attributo di sfondo del corpo HTML è deprecato così utilizzare fogli di stile per formattare le immagini di sfondo. Con gli stili CSS, sei in pieno controllo del modo immagini appaiono e si comportano sulle tue pagine Web.

Posizionamento

Un documento HTML può avere un'immagine di sfondo per l'intera pagina anche per quanto riguarda specifici elementi della pagina, ad esempio una tabella. Gli stili CSS possono formattare queste immagini di sfondo in vari modi. Stili di descrivono gli effetti e attributi quali il nome del file di origine per l'immagine, la frequenza con cui l'immagine viene ripetuta nella pagina e la posizione dell'immagine sul documento.

Sintassi

Per impostare la posizione e l'allineamento di un'immagine di sfondo, sarà necessario utilizzare diverse proprietà di sfondo CSS, ognuno dei quali controlla uno specifico attributo. È necessario utilizzare l'elemento utilizzato per l'immagine come il selettore nel foglio di stile. Ad esempio, se lo sfondo che si desidera allineare è l'immagine di sfondo principale, utilizzare il "corpo" come il selettore, come corrisponde al tag < body > in HTML.

La struttura è la stessa come tutta la sintassi CSS:

selettore {proprietà: valore;}

dove "selettore" è l'elemento HTML, "proprietà" è l'attributo o l'effetto e "valore" è l'informazione per tale attributo.

Proprietà

Ogni proprietà di sfondo CSS ha la propria funzione specifica. La proprietà background-image viene utilizzata per richiamare il file di immagine specifica. La proprietà background-repeat determina quante volte viene ripetuta nella pagina. Per decidere se l'immagine "galleggia" sopra la pagina o "attacca" ad esso come l'utente scorre la pagina, utilizzare background-attachment. Per impostare l'allineamento dell'immagine, utilizzare la proprietà background-position. Nota tale sfondo-posizione può essere contrassegnato in formato di testo come "centro", "alto a sinistra", ecc.; come percentuale; come unità; o come "ereditano"..--il che significa che userà la stessa posizione di un altro elemento HTML che lo contiene. Per impostare un'immagine al centro di una pagina, è possibile utilizzare il "centro di centro", "centro" o "50% 50%".

Esempi

Un'immagine di sfondo viene formattata con stili CSS incorporati tra i tag < head > di un documento HTML. Se il linguaggio di markup in un foglio di stile esterno, rimuovere il codice che ha le frecce.

In questo esempio, l'immagine di sfondo viene posizionata al centro della pagina. Esso è impostata su "nessuna ripetizione", quindi l'immagine viene visualizzata solo una volta, non affiancata come un modello. Lo sfondo è "fisso" - Se si sposta in alto o in basso o lateralmente sulla pagina, rimarrà nella stessa posizione sullo schermo, come se galleggiando. Ad esempio, se c'è il testo sulla pagina, il testo si sposterà ma lo sfondo non sarà. Se si desidera che l'immagine da spostare con il resto della pagina, invece, è possibile immettere "scorrimento" al posto "fisso" per background-attachment.

< testa >< stile tipo = "text/css" >

corpo

{

background-image:URL('company.gif');

background-repeat: no-repeat;

background-attachment: fisso;

sfondo-posizione: in centro;

}

< / stile >< / testa >