layout liquido

Home >>

<< CSS

Un layout liquido prevede una pagina web che occupa l’intero spazio disponibile sulal finestra del browser a prescindere dalla risoluzione del monitor. Ridimensionando la finestra del browser, la pagina assumerà le dimensioni opportune. A differenza quindi di un layout fisso dove vedremo spazi a destra e a sinistra del corpo del sito, il layout liquido permetto di occupare l’intera area disponibile. È anche vero che il layout liquido presenta uno sviluppo un po’ più complesso in quanto bisogna tener conto delle limitate possibilità grafiche soprattutto quando presentano colonne in percentuale. Un layout liquido si può ottenere: - non specificando la larghezza del contenitore - indicando una larghezza in percentuale al contenitore - assegnando un padding orizzontale al corpo - assegnando margini e padding al contenitore Una soluzione ottimale per avere meno limiti dal punto di vista grafico è rappresentanta dal layout semi-liquido, o layout progressivo o ancora jello layout dove vengono specificate una larghezza minima e una massima. Ciò si può ottenere tramite un metodo javascript o tramite CSS. Il layout elastico invece fa uso del dimensionamento in em sia per il testo sia per la larghezza degli elementi della pagina. Ridimensionando o ingrandendo il carattere del browser si otterrà un effetto zoom.