Šventojo Gralio CSS tinklelio išdėstymas – paruoštas kodas
Sukurkite CSS tinklelio išdėstymą vizualiai: nustatykite stulpelius, eilutes ir tarpus, tada įveskite sričių pavadinimus į langelius, kad sukurtumėte tinklelio šablono sritis – su tiesiogine peržiūra ir kopijuojamu CSS ir HTML.
Rezultatas
Šiame puslapyje atidaromas tinklelio generatorius, iš anksto įkeltas Šventojo Gralio išdėstymu: trys stulpeliai ir trys eilutės su antrašte ir porašte, apimančia visą plotį, o tarp jų - naršymo / pagrindinės / šalutinės eilutės. Antraštės eilutėje naudojamas automatinis aukštis, vidurinė eilutė užpildo likusią erdvę, o du šoniniai stulpeliai yra 200 pikselių, o pagrindinis stulpelis užima likusią dalį.
Šventojo gralio išdėstymas užsitarnavo savo pavadinimą, nes jį buvo tikrai sunku patikimai sukurti prieš CSS tinklelį – ilgus metus trukę plūduriuojantys įsilaužimai, lentelių išdėstymai ir absoliutus padėties nustatymas bandė suklastoti šią tikslią formą. Naudojant tinklelio šablono sritis, jis susitraukia iki penkių pavadintų regionų ir kelių takelių dydžių, todėl jis išlieka standartiniu pirmuoju CSS tinklelio mokymo pavyzdžiu.
Kiekvienas šio puslapio skaičius ir spraga vis dar galioja: sumažinkite šoninius stulpelius, pridėkite ketvirtą eilutę arba pervardykite sritį ir nedelsdami pervardykite peržiūrą bei kopijuojamą CSS naujinį. Nukopijuokite CSS ir HTML blokus tiesiai į savo projektą – viskas veikia jūsų naršyklėje, niekas neįkeliamas.