Kwa miaka mingi, sakafu za CSS zimekuwa fikra, lakini muhimu, sehemu katika kujenga mipangilio ya tovuti. Ikiwa mpango wako unaitwa kwa safu nyingi, umgeuka hadi unaelea . Tatizo na njia hii ni kwamba, licha ya ujuzi wa ajabu ambao wabunifu wa mtandao / watengenezaji wameonyesha katika kuunda mipangilio ya tovuti ngumu, sakafu za CSS hazikutafsiriwa kwa njia hii.
Wakati unapokwisha na uwekaji wa CSS una hakika kuwa na nafasi katika kubuni wavuti kwa miaka mingi ijayo, mbinu mpya za mpangilio ikiwa ni pamoja na CSS Gridi na Flexbox sasa zinawapa wabunifu wa mtandao njia mpya za kuunda mipangilio ya tovuti zao. Mbinu nyingine mpya ya mpangilio ambayo inaonyesha uwezo mkubwa ni nguzo nyingi za CSS.
Nguzo za CSS zimekuwa karibu kwa miaka michache sasa, lakini ukosefu wa msaada katika browsers wakubwa (hasa matoleo ya zamani ya Internet Explorer) imefanya wataalamu wengi wa wavuti kutumia mitindo hii katika kazi zao za uzalishaji.
Kwa mwisho wa msaada kwa matoleo hayo ya zamani ya IE, wabunifu wengine wa mtandao sasa wanajaribu chaguo mpya za mpangilio wa CSS, nguzo za CSS zilijumuisha, na kutafuta kuwa wana udhibiti mkubwa zaidi na njia hizi mpya kuliko walivyofanya na kuelea.
Msingi wa nguzo za CSS
Kama jina lake linavyoonyesha, nguzo nyingi za CSS (pia inajulikana kama mpangilio wa safu nyingi za CSS3) inakuwezesha kugawanya maudhui kwenye safu ya nguzo. Mali isiyohamishika zaidi ya CSS unayoweza kutumia ni:
- kuhesabu safu
- safu-pengo
Kwa kuhesabu safu, unataja idadi ya nguzo unayotaka. Pengo la safu itakuwa mabomba au nafasi kati ya nguzo hizo. Kivinjari kitachukua maadili haya na kupasua maudhui sawasawa kwenye idadi ya nguzo unazoelezea.
Mfano wa kawaida wa nguzo nyingi za CSS katika mazoezi ingekuwa kupanua kizuizi cha maudhui ya maandishi kwenye nguzo nyingi, sawa na kile unachokiona katika gazeti la gazeti. Sema una maridadi ya HTML yafuatayo (kumbuka kwamba kwa makusudi ya mfano, ninaweka tu mwanzo wa aya moja, wakati katika mazoezi kunaweza kuwa na aya nyingi za maudhui katika markup hii):
Kichwa cha makala yako
Fikiria aya nyingi za maandiko hapa ...
Ikiwa umeandika mitindo hii ya CSS:
Kuwasiliana {-ko-safu-safu: 3; -baki-safu-safu: 3; safu-hesabu: 3; -a-safu-pengo: 30px; -kabkit-safu-pengo: 30px; pembe ya safu: 30px; }Utawala huu wa CSS utagawanyika mgawanyiko wa "maudhui" kwenye safu tatu za sawa na pengo la saizi 30 kati yao. Ikiwa unataka nguzo mbili badala ya 3, ungebadilika tu thamani hiyo na kivinjari kitahesabu upana mpya wa nguzo hizo ili kupasua maudhui sawasawa. Ona kwamba tunatumia mali ya prefixed kwanza, ikifuatiwa na matangazo yasiyo ya prefixed.
Kama rahisi kama hii, matumizi yake kwa njia hii ni ya shaka kwa matumizi ya tovuti. Ndio, unaweza kugawa kipande cha maudhui kwenye safu nyingi, lakini hii inaweza kuwa sio bora zaidi ya kusoma kwenye Mtandao, hasa ikiwa urefu wa nguzo hizi huanguka chini ya "folda" ya skrini.
Wasomaji basi watahitajika kuzunguka hadi chini ili kusoma maudhui kamili. Hata hivyo, mkuu wa nguzo za CSS ni rahisi kama unavyoona hapa, na inaweza kutumika kufanya mengi zaidi kuliko kugawanya maudhui ya baadhi ya aya - inaweza kweli kutumika kwa mpangilio.
Mpangilio Na safu za CSS
Sema kwamba una ukurasa wavuti una eneo la maudhui ambayo ina nguzo 3 za maudhui. Hii ni mpangilio wa tovuti ya kawaida, na kufikia nguzo hizo 3, unaweza kawaida kuelea mgawanyiko unaoingia. Na nguzo nyingi za CSS, ni rahisi sana.
Hapa kuna sampuli ya HTML: