Scorrimento Sfondi Con CSS 3

April 26

Per impostazione predefinita, l'immagine di sfondo HTML impostato nel rotoli pagina Web con il resto del contenuto. Se si dispone di una pubblicità o si desidera impostare uno sfondo fisso che non scorre, è necessario impostare le proprietà della classe CSS appropriati. CSS ha diverse classi di sfondo che consentono di personalizzare l'immagine di sfondo e se i rotoli di immagine con il resto del contenuto o meno.

tipi

Tutti i browser permettono di impostare un'immagine di sfondo utilizzando i tipi PNG, JPG o GIF. Hai anche la possibilità di utilizzare il testo in background, ma i programmatori in genere utilizzare le immagini per creare uno sfondo che circonda il contenuto principale della pagina Web. Il tipo di immagine che si utilizza è irrilevante, tranne se si considera la velocità di caricamento per le pagine. Le immagini più grandi richiedono più tempo per gli utenti di caricare, in modo da immagini di grandi dimensioni creano una scarsa esperienza degli utenti per gli utenti con connessioni Internet lente.

scorrimento

I rotoli immagine di sfondo di default, quindi non è necessario impostare alcun classi speciali CSS per ottenere le immagini per scorrere con il resto della pagina. È necessario impostare la "ripetizione" preferenza per dire al browser se si desidera affiancare l'immagine quando non copre l'intera larghezza e l'altezza della pagina. La classe CSS "background-repeat" imposta l'aspetto piastrelle dell'immagine. "Repeat-x" ripete l'immagine in orizzontale. "Repeat-y" ripete l'immagine in verticale. Per fermare l'immagine da ripetere, utilizzare il valore "no-repeat".

rimuovere scorrimento

Se non si desidera che l'immagine di sfondo per scorrere, si utilizza la proprietà CSS "background-attachment". Quando si imposta questa proprietà di classe di "fisso", l'immagine rimane statica con la pagina come l'utente scorre. È possibile utilizzare questa impostazione per la pubblicità o le immagini che si estendono il contenuto della pagina. La barra di scorrimento scorre ancora il contenuto della pagina, ma l'immagine non cambia, come l'utente scorre.

considerazioni

Alcuni vecchi browser come Netscape o versioni di Internet Explorer, come la versione 6 o versioni precedenti non supportano lo sfondo di scorrimento effetti. Questo significa che anche se si smette di sfondo da scorrimento, browser più vecchi scorrere ancora sullo sfondo indipendentemente dalle impostazioni CSS.