Įvadas į CSS tinklelius
CSS tinkleliai yra būdas išdėstyti elementus vienu metu ir horizontaliai, ir vertikaliai. Tai pažangesnis būdas palyginti su lankstais, bet sudėtingesnis įsisavinti.
Norint sukurti tinklelį, reikia nustatyti
elemento savybę display
reikšme grid:
<div id="parent">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</div>
#parent {
display: grid;
}
Po to elementas pavirs dvimačiu tinklu, kuriame elementai išsidėsto vertikaliai (stulpeliai) ir horizontaliai (eilės). Sritis stulpelio ir eilės sankirtoje vadinama ląstele.
Naudojant specialias savybes galima bus išdėstyti elementus ir pagal eiles, ir pagal stulpelius. Tai leis lengvai kurti, pavyzdžiui, tokias struktūras:
Kitose pamokose mes pirmiausia išnagrinėsime elementų išdėstymą pagal stulpelius, tada pereisime prie eilių studijavimo, o po to sujungsime viską kartu.