Vlastnosti CSS3 pro vícesloupcový layout
Většina webových designérů a koderů si jistě pamatuje na dobu ne tak moc vzdálenou, kdy se pro tvorbu vícesloupcových layoutů stránek používaly tabulky (prvek <table>), ve kterých byly vnořeny tabulky, ve kterých byly vnořeny další tabulky a tak dál. Fungovalo to perfektně. Pak přišly kaskádové styly, které tvorbu vícesloupcových layoutů značně usnadnili – v HTML kódu stačilo vytvořit pár prvků <div>, které se následně prostřednictvím CSS vlastností jako width
, height
, float
, position
atd. naformátovaly a napozicovaly podle záměru webdesignéra. Vývoj ale samozřejmě pokračoval, tvůrci HTML a CSS specifikace si konečně uvědomili, že specifikace tu má být především pro webdesignéry a ne naopak, takže v HTML5 a CSS3 přibyla spousta nových praktických značek a vlastností. Například pro vytváření sloupců pomocí CSS3 byly představeno několik speciálních vlastností jako column-count
, column-width
, column-fill
atd. Článek CSS Columns z blogu Davida Walshe se věnuje právě těmto novým vlastnostem pro vytváření vícesloupcového layoutu. Popisuje význam jednotlivých vlastností a v příkladech demonstruje, jak je použít v praxi.
Zdroj: davidwalsh.name.
Mohlo by vás také zajímat
-
AI na dosah ruky: Jak je to s AI v osobních zařízeních?
22. ledna 2024
Nejnovější
-
Jak rozšířit úložiště Macu za pětinovou cenu?
16. prosince 2024 -
Nové trendy v doménách pro osobní projekty – DIY, LIVING a LIFESTYLE
9. prosince 2024 -
Jak chránit webové stránky před Web/AI Scrapingem
27. listopadu 2024 -
Jaký monitor je nejlepší k novému Macu Mini?
25. listopadu 2024
Anonym
Čvc 3, 2012 v 17:06CSS column vlastnosti rozhodně nejsou učeny pro tvorbu layoutu stránky, ale jen k formátování textu. Nelze totiž určit, co se vykreslí ve kterém sloupci (co se nevejde do prvního se dá do druhého.
kubajz
Čvc 7, 2012 v 16:38Tak tak, vlastnosti column-* jsou určeny pro „novinové“ sloupce.