Liczba kolumn {column-count}
W jaki sposób podzielić tekst na kilka kolumn?
CSS 3
selektor { column-count: liczba }
Selektorem może być dowolny element blokowy z wyjątkiem tabel [zobacz: Wstawianie stylów].
Liczba jest wartością naturalną, większą od zera. Aby usunąć kolumny lub pozwolić przeglądarce wyznaczyć ich szerokość w inny sposób, należy podać wartość auto.
Liczba jest wartością naturalną, większą od zera. Aby usunąć kolumny lub pozwolić przeglądarce wyznaczyć ich szerokość w inny sposób, należy podać wartość auto.
Polecenie jest przydatne, jeżeli ważniejsze jest dla nas, aby tekst zawsze znajdował się w ściśle określonej liczbie kolumn, a przeglądarka sama zajęła się automatycznym dopasowaniem ich szerokości.
Przykład {column-count}
column-count: 3;
To jest przykładowa treść, ułożona w wielu sąsiadujących kolumnach. Tekst jest automatycznie przenoszony z końca jednej kolumny na początek sąsiedniej, leżącej po jej prawej stronie... To jest przykładowa treść, ułożona w wielu sąsiadujących kolumnach. Tekst jest automatycznie przenoszony z końca jednej kolumny na początek sąsiedniej, leżącej po jej prawej stronie... To jest przykładowa treść, ułożona w wielu sąsiadujących kolumnach. Tekst jest automatycznie przenoszony z końca jednej kolumny na początek sąsiedniej, leżącej po jej prawej stronie... To jest przykładowa treść, ułożona w wielu sąsiadujących kolumnach. Tekst jest automatycznie przenoszony z końca jednej kolumny na początek sąsiedniej, leżącej po jej prawej stronie... To jest przykładowa treść, ułożona w wielu sąsiadujących kolumnach. Tekst jest automatycznie przenoszony z końca jednej kolumny na początek sąsiedniej, leżącej po jej prawej stronie...
To jest przykładowa treść, ułożona w wielu sąsiadujących kolumnach. Tekst jest automatycznie przenoszony z końca jednej kolumny na początek sąsiedniej, leżącej po jej prawej stronie... To jest przykładowa treść, ułożona w wielu sąsiadujących kolumnach. Tekst jest automatycznie przenoszony z końca jednej kolumny na początek sąsiedniej, leżącej po jej prawej stronie... To jest przykładowa treść, ułożona w wielu sąsiadujących kolumnach. Tekst jest automatycznie przenoszony z końca jednej kolumny na początek sąsiedniej, leżącej po jej prawej stronie... To jest przykładowa treść, ułożona w wielu sąsiadujących kolumnach. Tekst jest automatycznie przenoszony z końca jednej kolumny na początek sąsiedniej, leżącej po jej prawej stronie... To jest przykładowa treść, ułożona w wielu sąsiadujących kolumnach. Tekst jest automatycznie przenoszony z końca jednej kolumny na początek sąsiedniej, leżącej po jej prawej stronie...
Pytania i odpowiedzi {column-count}
Jak podzielić stronę HTML na kolumny?
Aby podzielić stronę HTML na kolumny za pomocą właściwości CSS column-count
, należy przypisać liczbę kolumn do odpowiedniego kontenera.
Jak zrobić dwie kolumny tekstu w HTML?
Aby stworzyć dwie kolumny tekstu w HTML przy użyciu właściwości CSS column-count
, można przypisać wartość 2 do liczby kolumn. Na przykład: .tekst { column-count: 2 }
.
Przeglądarki
Chrome | Firefox | Edge | Opera | Safari | |
---|---|---|---|---|---|
column-count: wartość | 50 2016-04-13 | 52 2017-03-07 | 12 2015-07-29 | 37 2016-05-04 | 9 2015-09-30 |
column-count: auto | 1 2008-12-11 | 1.5 2005-11-29 | 12 2015-07-29 | 15 2013-07-02 | 3 2007-10-26 |