Millal te CSS-i veerge kasutate? PlatoBlockchaini andmete luure. Vertikaalne otsing. Ai.

Millal te CSS-i veerge kasutate?

See pole retooriline: olen tõesti huvitatud CSS-i mitmeveeruliste paigutuste jaoks suurepäraste kasutusjuhtude leidmisest.

Vastus tundub otsene. Kasutage veerge, kui soovite mis tahes sisu veergudeks jagada, eks? Siin on üldiselt selline näide, mille leiate artiklitest, mis näitavad, kuidas CSS-i mitmeveerulised paigutused töötavad, sealhulgas meie enda oma. Almanak:

Täpselt nii. Kuid kas see on tegelik kasutusjuhtum? Mmmm võib-olla. Kui tekst on suhteliselt lühike, siis võib-olla on see hea puudutus. Nii müüsin selle endale kodulehte ümber kujundades a mõni aasta tagasi. Tänapäeval see nii ei ole, aga siis nägi see välja selline:

Millal te CSS-i veerge kasutate?

Aga terve pikakujuline artikkel veergudeks jagatud? Mulle meeldib see ajalehtedes, kuid kõhklen, kas kerida veebilehte alla, et lugeda ühte veergu, vaid kerida üles, et seda uuesti teha.

Ma arvan, et saame seda kasutada kahe elemendi kõrvuti paigutamiseks, kuid flexbox sobib selleks palju paremini. Lisaks takistab piirang meil valida veerge, et nende suurust eraldi määrata. Veerud peavad olema sama laiad.

Üks asi, mida veerud neile pakuvad, on see, et need on ainus CSS-i paigutusmeetod killud sisu. (See tähendab, kui me ei loe CSS-i piirkonnad… mis nendega ikkagi juhtus?!) Niisiis, kui soovite lõigu veergudeks jagada, on see juba võimalik ilma täiendavate ümbristeta.

Millal veel võib tekkida vajadus jagada pidev sisuplokk veergudeks? Mäletan, et pidin seda tegema, kui mul oli suur järjestamata kaupade nimekiri. Mulle meeldib, kuidas loendid muudavad sisu skannimise lihtsaks, kuid pikad loendid võivad muuta lehe ühe külje üliraskeks. Oletame näiteks, et loetlesime kõik CSS-trikkide postitussildid tähestikulistes rühmades. Mitme veeru paigutus sobib selleks suurepäraselt:

Jätkake ja proovige vaateava laiust muuta. Määratletud on kolm veergu, kuid arv muutub olenevalt vaba ruumi hulgast. Pean armastama kõike seda reageerivat headust, ilma et meediumipäring toimiks!

Töötasin demo kallal :left pseudoklassi ja jõudis columns sest see on suurepärane võimalus demode printimiseks asju killustada. Niisiis, ma arvan, et on veel üks kasutusjuhtum. Ja demot tehes mõistsin, et mitme veeru paigutusega saab luua esemetest müüritise, näiteks pildigalerii:

Aga mida veel? Kas piirdume lühikeste lõikude, pikkade loendite ja vabalt voolavate ruudustikutega?

Ajatempel:

Veel alates CSSi trikid