Nettbutikkområdet kan bestå av et venstre- og et høyreområde, et midtområde, et toppfelt og et bunnfelt. Hele området er delt i 12 kolonner ved hjelp av Bootstraps rutesystem, som er del av CSS. For mer informasjon kan du se http://getbootstrap.com/css/#grid.
Bootstrap tillater skalering for mobile enheter. Bootstrap inkluderer et responsivt, trinnløst rutesystem utviklet for mobile enheter som skalerer opp til 12 kolonner etter som størrelsen til enheten eller visningsporten øker. For mer informasjon kan du se http://getbootstrap.com/css/#grid-example-basic.
MERK
Du må teste kundenes forventede skjermoppløsninger på nettbutikken.
Store enheter: store datamaskiner, fra 1200 piksler og oppover.
Middels store enheter: datamaskiner, fra 992 piksler og oppover.
|
Layout |
Antall kolonner |
|---|---|
|
Venstre: 2 kolonner Høyre: 0 kolonner Midt: 10 kolonner |
|
Venstre: 2 kolonner Høyre: 2 kolonner Midt: 8 kolonner |
|
Venstre: 0 kolonner Høyre: 2 kolonner Midt: 10 kolonner |
|
Venstre: 0 kolonner Høyre: 0 kolonner Midt: 12 kolonner |
Små enheter: nettbrett, fra 768 piksler og oppover.
|
Layout |
Antall kolonner |
|---|---|
|
|
Venstre: 1 kolonne Høyre: 0 kolonner Midt: 11 kolonner |
|
|
Venstre: 1 kolonne Høyre: 1 kolonne Midt: 10 kolonner |
|
|
Venstre: 0 kolonner Høyre: 1 kolonne Midt: 11 kolonner |
|
|
Venstre: 0 kolonner Høyre: 0 kolonner Midt: 12 kolonner |
Ekstra små enheter: telefoner, mindre enn 768 piksler
En fast utforming.
Høyden på toppfeltet er 48 piksler.
Høyden på bunnfeltet er 48 piksler.
Ingen venstre- og høyrekolonner.
Bredden til midtområdet vil være avhengig av enheten. For eksempel er bredden:
375 piksler på en Apple iPhone 6
412 piksler på en Motorola Nexus 6