October 13
Le colonne sono creati sulle pagine Web utilizzando più contenitori in linea DIV in stile con i CSS, o Cascading Style Sheet, codice per definire le larghezze e margini in pixel. Questi contenitori DIV sono in genere annidati all'interno di un DIV grande "wrapper" che definisce la larghezza complessiva della pagina Web. È possibile calcolare il numero di contenitori DIV può andare bene all'interno del DIV involucro sottraendo la larghezza e margini di ogni DIV dalla larghezza dell'involucro. Questo può essere complicato quando si utilizzano più contenitori div con diverse larghezze di margine. Fortunatamente, esistono diversi siti web che può calcolare il vostro disegno colonna per voi.
1 Avviare il browser Web e navigare il sito web "Problema Labs Griglia calcolatrice".
2 Digitare la larghezza in pixel del DIV involucro in "Larghezza totale" campo di testo.
3 Trascinare i "Colonna" cursori per definire una larghezza minima e massima della colonna in pixel.
4 Trascinare i "Gutter Width" cursori per definire una larghezza massima margine minimo e in pixel.
5 Fare clic sul pulsante "Calcola combinazioni possibili" per visualizzare tutti i possibili disegni di colonna per la larghezza involucro specificato utilizzando la colonna e margine larghezze immessi. Fare clic sul collegamento "Anteprima e scaricare CSS" sopra una delle varianti di design colonna per scaricare un file CSS che contiene il codice di progettazione della colonna.
6 Avviare il browser Web e navigare il sito web "Blue Calc".
7 Digitare la larghezza minima della colonna in pixel nel campo di testo "Larghezza minima colonna". Digitare la larghezza massima della colonna nel campo di testo "Larghezza massima colonna".
8 Digitare la larghezza minima del margine nel campo di testo "Larghezza minima del margine". Digitare la larghezza massima del margine nel campo di testo "Larghezza massima del margine".
9 Digitare la larghezza involucro in pixel nel campo di testo "Total larghezza della griglia".
10 Fare clic sul pulsante "Calcola" per visualizzare i possibili disegni di colonna per il tuo DIV involucro utilizzando la colonna e margine larghezze immessi. Fare clic sul pulsante "Download grid.css" a destra di uno dei disegni di colonna per scaricare un file CSS che contiene il codice di progettazione della colonna.
11 Avviare il browser Web e accedere alla pagina Web "Spry-Soft variabile Grid System".
12 Fare clic per inserire un segno di spunta nella casella "Controllo per modificare la larghezza". Digitare la larghezza involucro in pixel nel campo di testo "a tutta larghezza".
13 Digitare il numero di colonne che si desidera utilizzare nella progettazione colonna nel "Numero di colonne" campo di testo.
14 Digitare la larghezza del margine nel campo di testo "width Gutter". Dopo aver digitato la larghezza del margine, l'anteprima di seguito verrà aggiornato e il campo larghezza della colonna viene automaticamente compilato con la più grande larghezza della colonna possibile.
15 Fare clic sul pulsante "Download file CSS" per scaricare un file CSS che contiene il codice di progettazione della colonna.