Video: Dreamweaver CS6 - Inserire un'immagine di sfondo a tutto schermo ridimensionabile in una pagina web 2025
La creazione di sfondi per pagine Web in Adobe Dreamweaver CS6 è divertente e può essere perseguita in molti modi diversi da quanto la maggior parte delle persone potrebbe immaginare. È possibile creare un motivo ripetuto con una singola immagine piccola, creare una filigrana o utilizzare un'immagine grande per riempire un intero sfondo.
Come impostazione predefinita, uno sfondo HTML ripete l'immagine selezionata fino a riempire lo schermo. Insieme alle proprietà CSS, è possibile controllare o eliminare il comportamento ripetuto e persino impostare il posizionamento preciso per una singola immagine di sfondo.
Se si sta riempiendo uno sfondo con un motivo, assicurarsi di creare un'immagine di modello che non ha bordi riconoscibili.
Per utilizzare a proprio vantaggio la piastrellatura ripetuta e predefinita per un'immagine di sfondo, attenersi alla seguente procedura:
-
In Photoshop, selezionare File → Nuovo per creare una nuova immagine.
-
Nella nuova finestra di dialogo che appare, crea un'immagine molto più ampia di quanto sia alta, scegli RGB, scegli 72 dpi, quindi fai clic su OK.
Ad esempio, immettere 1000 nel campo di testo Larghezza e 20 nel campo di testo Altezza.
-
Seleziona un colore di primo piano e di sfondo per creare una fusione; quindi utilizzare lo strumento Sfumatura in Maiusc + trascinamento dall'alto verso il basso dell'area dell'immagine per creare un riempimento sfumato.
-
Scegli File → Salva per Web, salva l'immagine come file JPEG nella cartella del contenuto web del tuo sito, quindi chiudi l'immagine.
-
In Dreamweaver, selezionare Modifica → Proprietà della pagina o fare clic sul pulsante Proprietà pagina nella finestra di ispezione Proprietà per posizionare l'immagine come immagine di sfondo sulla pagina Web.
Se il pulsante Proprietà pagina non è visibile, fare clic sulla pagina: assicurarsi di non selezionare un altro elemento, ad esempio un'immagine.
Viene visualizzata la finestra di dialogo Proprietà pagina.
-
Nella finestra di dialogo Proprietà pagina, fare clic sul pulsante Sfoglia a destra dell'immagine di sfondo. Nella finestra visualizzata, passa alla posizione dell'immagine di sfondo salvata, quindi fai clic su OK.
-
Indietro nella finestra di dialogo Proprietà pagina, fare clic su OK.
L'immagine appare sullo sfondo, ripetendo e creando un gradiente di sfondo alla fine della pagina!
A seconda delle dimensioni e della risoluzione del monitor di un utente, l'immagine di sfondo potrebbe essere costretta a ripetere. La ripetizione di un'immagine di sfondo può dare dei risultati creativi.
In alcuni casi, potresti non vedere lo sfondo finché non fai clic sul pulsante Anteprima / Debug nel browser e visualizzi l'anteprima della pagina nel browser predefinito.
