Când folosiți coloanele CSS? PlatoBlockchain Data Intelligence. Căutare verticală. Ai.

Când folosiți coloanele CSS?

Asta nu este retoric: sunt cu adevărat interesat să găsesc cazuri de utilizare grozave pentru layout-urile cu mai multe coloane CSS.

Răspunsul pare simplu. Folosiți coloane când doriți să împărțiți orice conținut în coloane, nu? Iată, în general, genul de exemplu pe care îl veți găsi în articolele care arată cum funcționează aspectele CSS cu mai multe coloane, inclusiv propriile noastre Almanah:

Chiar pe. Dar este acesta un caz de utilizare real? Mmmm poate. Dacă textul este relativ scurt, atunci poate că este o atingere plăcută. Așa mi l-am vândut atunci când mi-am reproiectat site-ul a acum cativa ani. Nu este așa astăzi, dar așa arăta atunci:

Când folosiți coloanele CSS?

Dar un întreg articol lung împărțit în coloane? Îmi place în ziare, dar ezit să derulez în jos pe o pagină web pentru a citi o coloană, doar pentru a derula înapoi pentru a o face din nou.

Presupun că îl putem folosi pentru a plasa două elemente unul lângă altul, dar flexbox este mult mai potrivit pentru asta. În plus, o limitare ne împiedică să selectăm coloanele pentru a le dimensiona individual. Coloanele trebuie să aibă aceeași lățime.

Un lucru pe care coloanele îl au pentru ei este că sunt singura metodă de aspect CSS care fragmente conţinut. (Adică dacă nu numărăm Regiunile CSS… ce s-a întâmplat cu aceia, oricum?!) Deci, dacă doriți să împărțiți un paragraf în coloane, este deja posibil fără învelișuri suplimentare.

Când altceva ar putea fi nevoie să împărțiți un bloc continuu de conținut în coloane? Îmi amintesc că trebuia să fac asta când aveam o listă mare de articole neordonate. Îmi place felul în care listele pot face conținutul ușor de scanat, dar listele lungi pot face ca o parte a paginii să pară foarte grea. Să presupunem, de exemplu, că am enumerat toate etichetele de postare pentru trucuri CSS în grupuri alfabetice. Un aspect cu mai multe coloane funcționează minunat pentru asta:

Continuați și încercați să redimensionați lățimea ferestrei de vizualizare. Sunt definite trei coloane, dar numărul se va modifica în funcție de cantitatea de spațiu disponibil. Trebuie să iubesc toată acea bunătate receptivă fără a funcționa interogarea media!

Lucram la un demo pentru :left pseudo-clasă și a ajuns la columns pentru că este o modalitate excelentă de a fragmenta lucrurile pentru imprimarea demonstrațiilor. Deci, cred că există un alt caz de utilizare. Și în timp ce făceam o demonstrație, mi-am dat seama că un aspect cu mai multe coloane poate fi folosit pentru a crea o grilă de zidărie de articole, cum ar fi o galerie de imagini:

Dar ce altceva? Ne limităm la paragrafe scurte, liste lungi și grile care curg liber?

Timestamp-ul:

Mai mult de la CSS Trucuri