Mikor használsz CSS-oszlopokat? PlatoBlockchain adatintelligencia. Függőleges keresés. Ai.

Mikor használsz CSS-oszlopokat?

Ez nem retorikus: nagyon érdekel, hogy nagyszerű használati eseteket találjak a többoszlopos CSS-elrendezésekhez.

A válasz egyértelműnek tűnik. Használjon oszlopokat, ha bármilyen tartalmat oszlopokra szeretne osztani, igaz? Ez általában az a fajta példa, amelyet azokban a cikkekben találhat, amelyek bemutatják, hogyan működnek a CSS többoszlopos elrendezései, beleértve a sajátunkat is. Évkönyv:

Közvetlenül. De ez tényleges használati eset? Mmmm talán. Ha a szöveg viszonylag rövid, akkor talán ez egy kellemes érintés. Így adtam el magamnak a weboldalam újratervezésekor a néhány évvel ezelőtt. Ma nem így van, de akkor így nézett ki:

Mikor használsz CSS-oszlopokat?

De egy egész hosszú cikk hasábokra oszlik? Imádom az újságokat, de habozok lefelé görgetni egy weboldalt, hogy elolvassak egy oszlopot, de csak felfelé görgetve újra megcsinálom.

Azt hiszem, használhatjuk két elem egymás mellé helyezésére, de a flexbox sokkal alkalmasabb erre. Ráadásul egy korlátozás megakadályozza, hogy az oszlopokat külön-külön méretre jelöljük ki. Az oszlopoknak azonos szélességűeknek kell lenniük.

Az egyik dolog, amit az oszlopok érdekelnek, az az, hogy ez az egyetlen CSS-elrendezési módszer töredékek tartalom. (Azaz, hacsak nem számolunk CSS régiók… mi történt velük?

Mikor kell még egy folyamatos tartalomblokkot oszlopokra bontani? Emlékszem, ezt kellett tennem, amikor egy nagy, rendezetlen listám volt. Szeretem, ahogy a listák segítségével könnyen beolvasható a tartalom, de a hosszú listák miatt az oldal egyik oldala rendkívül nehéznek tűnik. Tegyük fel például, hogy a CSS-trükkök összes bejegyzési címkéjét alfabetikus csoportokban soroltuk fel. A többoszlopos elrendezés remekül működik erre:

Folytassa, és próbálja átméretezni a nézetablak szélességét. Három oszlop van meghatározva, de a szám a rendelkezésre álló hely mennyiségétől függően változik. Imádni kell ezt az érzékeny jóságot a médialekérdezés nélkül!

Egy demón dolgoztam a :left álosztályú és elérte columns mert ez egy nagyszerű módja a dolgok töredezettségének demók nyomtatásához. Szóval, azt hiszem, van egy másik használati eset is. A demó készítése közben pedig rájöttem, hogy egy többoszlopos elrendezéssel elemekből falazott rácsot lehet létrehozni, például egy képgalériát:

De mi mást? Rövid bekezdésekre, hosszú listákra és szabadon folyó rácsokra korlátozódik?

Időbélyeg:

Még több CSS trükkök