Layout a tre colonne con immagine di background

17 marzo 2006

Come per la versione analoga con i float, anche in questo caso è consigliato l’uso di un container aggiuntivo. Ecco quindi il codice HTML base:

<body>
  <div id=”container”>
    <div id=”container2″>
        <div id=”header”></div>
        <div id=”content”></div>
        <div id=”extra”></div>
        <div id=”navigation”></div>
        <div id=”footer”></div>
    </div>
  </div>
</body>

Le regole CSS da aggiungere sono semplici:

div#container{position: relative;
background:url(3rightcol.jpg) repeat-y top right
}

div#container2{background: url(3leftcol.jpg) repeat-y top left}

Anche qui basta semplicemente scegliere il tipo di layout. Ho preparato la versione con layout fisso.

Scarica il file zip di esempio di questa lezione

Tutte le lezioni

1 ... 30 31 32 ... 41

Se vuoi aggiornamenti su Layout a tre colonne con immagine di background inserisci la tua e-mail nel box qui sotto:
 
X
Se vuoi aggiornamenti su Layout a tre colonne con immagine di background

inserisci la tua e-mail nel box qui sotto:

Ho letto e acconsento l'informativa sulla privacy

Acconsento al trattamento dei dati per attività di marketing