• User Attivo

    sfondi differenti

    Salve e auguri a tutti.
    Scrivo perchè nel realizzare un mio sito, mi sto chiedendo come realizzare diversi sfondi per diverse pagine.
    Avevo pensato di creare due css differenti, uno per le impostazioni generali di tutte le pagine ed un altro contenente solo le impostazioni dello sfondo per le singole pagine.
    E' fattibile una simile soluzione? O devo fare un unico css con le impostazioni delle varie pagine?
    In quest'ultimo caso potreste darmi un consiglio su come fare.
    Grazie


  • Super User

    Ciao Taiku 🙂
    Ti propongo una soluzione più elegante , sempre se ti piace 🙂

    Crei in totale 3 fogli di stile, qui ti faccio un esempio:

    *global.css
    layout.css.
    sfondi.css *

    in global.css inserisci questo:

    @import url('layout.css');
    @import url('sfondi.css');
    ```in **layout.css **ci inserisci tutte le proprietà della tua pagina nel generale.
    in **sfondi.css** inserisci la definizione di più "id" che andrai ad attribuire a chi ospiterà il tuo sfondo tipo:
    
    

    #sfondoA{
    background:url('sfondo1.jpg') .. ;
    }
    #sfondoB{
    background:url('sfondo2.jpg') .. ;
    }
    #sfondoC{
    background:url('sfondo3.jpg') .. ;
    }

    
    In ogni pagina ti basterà cambiare l'id del contenitore in modo da visualizzare uno sfondo per ognuno di essi.
    
    Poi grazie a global.css ti basterà richiamare un solo file all'interno del tuo html poichè tramite gli import ti gestirà tutto lui. 
    
    ciao!

  • User Attivo

    Grazie Karedas, la tua soluzione mi sembra ottimale, poichè in questo modo velocizzo sicuramente il tutto. A dire il vero mi costringe a studiare meglio le colonne inserite nel contenitore di sfondo, cosa che non mi è mai riuscita di centrare bene, ma ben venga.
    Vorrei farti un'altra domanda ot, se posso.
    Poichè le colonne potrebbero avere degli altri sfondi a loro volta, o comunque dei colori di fondo, come posso renderle trasparenti i colori in modo da poter vedere attraverso lo sfondo del div container?
    Spero di non star chiedendo l'impossibile... ma vorrei cercare di fare un bel sito, almeno secondo le mie possibilità.
    Grazie.


  • Super User

    Di default i div, sempre che tu non abbia impostato una proprietà generale per tutti loro, non hanno un colore di sfondo poichè inizialmente godono di questo attributo:

    **background-color: transparent ;

    **Se invece non ho capito e vorresti realizzare un effetto "velato" allora la cosa si complica poichè attualmente , qualcuno mi corregga in caso, non esiste un valore di background che escluda la proprietà alpha dalle immagini.


  • User Attivo

    E' la seconda che vorrei cercare di realizzare.
    Però si potrebbe ovviare al problema background-color con le immagini anche qui, nel senso che si possono creare gli sfondi come immagini con pochi kbite e lavorare con photoshop o altro sulla proprietà alfa, inseriti come sfondo ed il gioco dovrebbe essere fatto.
    Secondo te può funzionare?


  • Super User

    Internet explorer precedente alla versione 10 non accetta il canale alpha se non attraverso degli exploit dati da script su immagini png.
    Ma, anche con una delle due possibilità, la necesità del canale alpha si usa per permettere ad esempio ad immagini "rotonde" di posizionarsi su uno sfondo senza che l'immagine venga visualizzata - per mancanza appunto di tale canale - all'interno di un proprio quadrato naturale (così rendendola inutilizzabile).

    Creare uno sfondo velato non mi pare si possa realizzare se non tramite librerie e applicativi tipo le famose e dinamiche mootools.

    Altro non saprei dirti magari mi informo se esiste qualche novità a riguardo ma sono quasi sicuro che per quanto riguarda le zone del sito "costanti" non sia possibile se non appunto realizzando tramite photoshop un .jpg e salvarlo come se simulasse l'opacità.

    Ciao! 🙂