kolumna - Kurs HTML i CSS
Dobre praktyki / Przykazania webmastera...aby użytkownik szukał ich gdzieś w treści obszernego artykułu. Dobre miejsce na nawigację to nagłówek serwisu (poziome menu) oraz lewa lub prawa kolumna (pionowe menu lub menu z nagłówkami). Czasami w nagłówku umieszcza się powtórzoną nawigację, która zbiera najważniejsze odnośniki z całego serwisu. Podobnie coraz częściej powtórzona nawigacja pojawia się w stopce serwisu, ale w odróżnieniu od linków nagłówkowych, może zawierać znacznie więcej odnośników. Oprócz tego stopka jest dobrym...
- Komendy CSS3 / Układ siatki CSS
Źródło: CSS Grid Layout Module Level 1 Spis treści grid grid-area grid-auto-columns grid-auto-flow grid-auto-rows grid-column grid-column-end grid-column-start grid-row grid-row-end grid-row-start grid-template grid-template-areas grid-template-columns grid-template-rows grid Atrybuty mieszane układu siatki Wartość <'grid-template'> | <'grid-template-rows'> / [ auto-flow && dense? ] <'grid-auto-columns'>? | [ auto-flow && dense? ] <'grid-auto-rows'>...
Komendy HTML 4.01 / Wykaz atrybutów...archiwów codetype OBJECT Typ zawartości dla kodu color BASEFONT, FONT Kolor tekstu cols FRAMESET Lista długości, domyślnie: 100% (1 kolumna) cols TEXTAREA (wymagany) Liczba kolumn w polu komentarza colspan TD, TH Liczba połączonych komórek w kolumnie compact DIR, DL, MENU, OL, UL Redukuje odstępy pomiędzy pozycjami content META (wymagany) Związana informacja coords A Do użytku z mapą odnośników klienta coords AREA Lista długości oddzielona...
- Szablon strony na DIV-ach / Responsywny szablon
...zwykle znajdują się tam tylko poboczne treści, które w takiej sytuacji mogłyby zaciemniać odbiór głównej treści. Oczywiście jeśli na Twojej stronie kolumna z dodatkowymi informacjami zawiera istotne treści, które nawet na smartfornach nie powinny zostać pominięte, nie stosuj deklaracji "display: none".
- Komendy HTML 4.01 / Wykaz elementów
Element Znacznik otwierający/ zamykający Wyświetlanie Opis A wymag/wymag w linii Kotwica ABBR wymag/wymag w linii Forma skrócona ACRONYM wymag/wymag w linii Akronim ADDRESS wymag/wymag w bloku Informacje o autorze APPLET wymag/wymag w linii Aplet AREA wymag/zabr Obszar w mapie odnośników klienta B wymag/wymag w linii Tekst pogrubiony BASE wymag/zabr Adres bazowy BASEFONT wymag/zabr w linii Czcionka bazowa BDO wymag/wymag...
- Rozmiary CSS / Przeciąganie {resize}
...elementu Zdarza się, że treść elementu nie mieści się w ustalonych dla niego wymiarach. Może to spowodować zaburzenie estetyki strony - np. kolumna menu może w takiej sytuacji opaść na dół (pod treść). Można się przed tym zabezpieczyć blokując przepełnienie elementu ("overflow: hidden"). Co jednak, jeśli czytelnik mimo wszystko będzie chciał zobaczyć przyciętą treść? Można mu to umożliwić, poprzez udostępnienie specjalnego uchwytu do przeciągania narożnika elementu (zwykle...
- Podcast HTML / #5 Tabele HTML
...grupy strukturalne i umożliwia nadawanie formatowania całej grupie za pomocą CSS. Atrybut span="x" określa liczbę kolumn do połączenia. Pojedyncza kolumna <col>: jest używana wewnątrz <colgroup> i pozwala nadać dodatkowe atrybuty poszczególnym kolumnom. Formatowanie z <col> nadpisuje formatowanie określone dla całej grupy <colgroup>. Zagnieżdżanie tabel: możliwe jest wstawianie tabel jedna w drugiej. Tabela podrzędna (wewnętrzna) jest umieszczana wewnątrz znacznika komórki <td> tabeli...
- Układ wielokolumnowy CSS / Multi-column layout
...czasopisma przyzwyczaiły czytelników do układu wielokolumnowego. Tekst artykułów jest w nich ułożony w wielu wąskich, sąsiadujących ze sobą kolumnach. Dzięki temu zwykle staje się on łatwiejszy w czytaniu, gdyż przenosząc wzrok z końca jednej linijki na początek kolejnej, oko nie musi pokonywać długiej drogi. Wiele nowoczesnych serwisów internetowych również składa się z kilku kolumn, ale najczęściej inaczej niż w gazecie właściwa treść artykułu znajduje się w pojedynczej kolumnie, a...
- Układ wielokolumnowy CSS / Szerokość kolumny {column-width}
...45px; width: 100px", aby kolumny zajęły całą poziomą przestrzeń elementu, zostaną dopasowane do szerokości 50px. W szczególnym przypadku kolumna może być również węższa niż podano - jeżeli cały blok jest węższy, aby mógł pomieścić przynajmniej jedną kolumnę. W obecnej wersji specyfikacja CSS nie pozwala ustalać różnej szerokości kolumn tego samego elementu. Przykład {column-width} column-width: 100px; To jest przykładowa treść, ułożona w wielu sąsiadujących kolumnach. Tekst jest...
- Układ wielokolumnowy CSS / Przełamanie kolumny {break-before, break-inside, break-after}
...We wszystkich przypadkach selektorem musi być element blokowy (wstawiony wewnątrz kolumny). Tekst nie zawsze musi przełamywać się między kolumnami tak, jak byśmy sobie tego życzyli. Możemy np. nie chcieć, aby tytuł znalazł się na końcu kolumny. W takim przypadku estetyczniej będzie wyglądało, jeśli kolumna przełamie się wcześniej, aby tytuł znalazł się na początku następnej. Taki efekt zapewnimy poprzez nadanie stylu: h1 { break-after: avoid-column } Z drugiej strony możemy...