Lehtedele saab lisada sisu,
- Lihtsalt stiilis pealkiri ja tekst.
- Ladudes lehe sisu kokku plokkidest
Luues lehe sisu plokkide kaupa, võimaldab luua lehti kus sisu on paremini strukteeritud.
Jaotusplokke sisaldavaid kaste otseselt ei kuvata veebilehe külastajale kastidena vaid lihtsalt lehe sisu asetus on vastavalt määratud plokile.
Jaotusploki kuvamine eeldab, et see on täidetud sisuplokkidega vähemalt osaliselt. Kui jaotusplokki ei ole ühtegi sisuplokki sisestatud, siis seda ei kuvata.
Jaotusplokkide näidis jaotus lehel
Jaotusploki valimine
Kui jaotusplokki mõned jaotised on sisuplokkidest tühjad, siis neid jaotisi ei kuvata. Vastavalt sellele liiguvad järgmised jaotusplokid paremalt vasakule.
Plokkide loogika
Lai desktop vaade
Alates 1376px ekraani laiusest ülespoole, on kasutusel 1328px lai sisuplokk.
Vasakmenüüga sisulehe puhul on alates 1376px ekraani laiusest ülespoole, on kasutusel 272px lai vasakmenüü ja 992px lai sisuplokk.
Jaotusplokkide vahe on vertikaalselt 40px, sama sisestusploki sees on vertikaalne vahe plokkidel 16px.
Horisontaalselt on jaotusplokkide vahed 32px.
Võimalikud jaotusplokid:
Sisulehtedel saab kasutada 100%, 75%, 66%, 50%, 33% ja 25% sisuplokke kombinatsioonides:
- 100
- 50-50
- 50-25-25
- 25-25-50
- 75-25
- 25-75
- 66-33
- 33-66
- 33-33-33
- 25-25-25-25
Avalehel ehk esilehel saab kasutada 100%, 75%, 50% ja 25% sisuplokke.
Kitsas desktop vaade
1375px - 992px (kitsas desktop) ekraani laiusel muutub sisuplokk vastavalt ekraani laiusele.
Vasakmenüüga sisulehe puhul on 1375px - 992px ekraani laiusel 228px lai vasakmenüü ja sisuplokk muutub vastavalt ekraani laiusele.
Horisontaalselt on jaotusplokkide vahed 24px.
Tahvel
Alates 991px ekraani laiusest algab tahvlivaade ning on kasutusel ainult 100% ja 50-50% sisuplokid. Avalehel on tahvlis kasutusel ainult 100% sisuplokid.
Horisontaalsed plokkide vahed on 24px. Vertikaalsed plokkide vahed on 24px.
- 50-50 -→ 100 ühel real + 100 teisel real
- 25-25-25-25 ---> 50-50 ühel real + 50-50 teisel real
- 25-25-50 ---> 50-50 ühel real + 100 teisel real
- 50-25-25 ---> 100 ühel real + 50-50 teisel real
- 25-75 ---> 50-50
- 75-25 ---> 50-50
- 33-33-33 ---> 100 kolm rida
- 66-33 ---> 50-50
- 33-66 ---> 50-50
Mobiil
Alates 575px ekraani laiusest algab mobiilivaade ning on kasutusel ainult 100% sisuplokid.
Parem ja vasak padding on 24px. Vertikaalsed plokkide vahed on 24px.