Quando crei un sito web reattivo, dovrai calcolare una griglia di 24 colonne sotto bootstrap per la massima risoluzione
Printed 2011-02-20
Nel 95% dei casi basteranno quelle griglie che si trovano già pronte sul mio sito web o su Internet. Ma sarà utile dire come calcolare la griglia: ad esempio, le specifiche del sito potrebbero richiedere grandi rientri all'interno delle colonne e così via. In particolare, quando crei un design adattivo di un sito web , che dovrebbe anche essere di gomma, dovrai calcolare la griglia a 24 colonne sotto il bootstrap per la massima risoluzione (di solito 1920px).
Ad esempio, prendiamo un layout con una width di 1600 px e proviamo a creare una griglia di otto colonne.
La formula è: Larghezza dello schermo 1600 = 8 * (width della colonna) + 7 * (due larghezze di rientro all'interno della colonna).
Il rientro all'interno della colonna è solitamente di 5 ... 10 pixel; il nostro compito è selezionare tale valore di rientro. A cui la width della colonna di questa formula sarà un numero intero.
Ad esempio, sostituisci qui la width del rientro di 6 pixel; quindi la width della colonna sarà (1600 - 7 * 2 * 6)/8 = 189,5 pixel. Non adatto. La stessa cosa ci aspetta nel caso di 7 pixel. Ma con un rientro pari a 8 pixel, tutto va molto meglio:
Larghezza colonna = (1600 - 7 * 2 * 8)/8 = 186 pixel. Qui puoi calcolare le griglie in un modo così semplice.
Maggiori informazioni sulle griglie nel design:
Perché abbiamo bisogno della griglia< br> Oltre i confini delle colonne
Regola della densità
Griglia e umore
Griglia reattiva per Bootstrap
Formula per la griglia
Metodo: se la griglia fallisce
