tabela - Kurs HTML i CSS
Tabele HTML / Struktura tabeli HTML <table, tr, td><table> <tr> <td>...</td> <td>...</td> </tr> <tr> <td>...</td> <td>...</td> </tr> </table> Jest to najprostsza tabela, gdzie: <table>...</table> jest znacznikiem tabeli <tr>...</tr> jest znacznikiem wiersza <td>...</td> jest znacznikiem pojedynczej komórki W miejsce kropek należy wpisać treść poszczególnych komórek tabeli. Powyższe polecenia tworzą tabelę, złożoną z dwóch kolumn i dwóch wierszy (razem cztery komórki). Jeśli to konieczne, możliwe jest dodanie nowych kolumn (poprzez...
Tabele CSS / Rozplanowanie tabeli {table-layout}...możliwych minimalnych i maksymalnych szerokości poszczególnych kolumn wpływają na ostateczną szerokość tabeli w następujący sposób: Jeżeli tabela ma zdefiniowaną szerokość inną niż "auto", ostateczna szerokość tabeli jest określona przez większą z wartości: odgórnie ustalona szerokość tabeli oraz suma minimalnych szerokości poszczególnych kolumn powiększona o odstępy między komórkami i obramwanie. Jeżeli odgórnie ustalona szerokość tabeli jest większą wartością, poszczególne kolumny...
- Pozycjonowanie CSS / Wyświetlanie {display}
...sformatowany jako "inline" (w linii) w ramach treści brata. W przeciwnym razie element zostanie sformatowany jako "block" (Opera 6, Chrome) table - tabela blokowa: <table>...</table> inline-table - tabela "inline": <table>...</table> table-row-group - grupa wierszy tabeli: <tbody>...</tbody> table-header-group - nagłówek tabeli: <thead>...</thead> table-footer-group - stopka tabeli: <tfoot>...</tfoot> table-row - wiersz tabeli: <tr>...</tr> table-column-group - grupa kolumn tabeli...
- Pozycjonowanie CSS / Widzialność {visibility}
...drugiego wiersza visibility: hidden komórka1 komórka2 komórka3 komórka4 - o szerszej zawartości komórka5 komórka6 Dla porównania ta sama tabela bez zmiany widzialności: komórka1 komórka2 komórka3 komórka4 - o szerszej zawartości komórka5 komórka6 Zwróć uwagę na różnice pomiędzy działaniem "visibility: collapse" a "display: none". W pierwszym przypadku, mimo iż wiersz z szerszą komórką został ukryty, kolumna w której się znajdowała nie zmniejszyła swojej szerokości. W...
- Tekst CSS / Tryb pisania {writing-mode}
...wieloma kolumnami, w których znajdują się krótkie wartości - np. małe liczby całkowite. Jeśli do takiej tabeli dodamy nagłówek, może okazać się, że tabela stanie się bardzo szeroka, przez co trudno będzie ją czytać. W takiej sytuacji czasami lepiej jest wpisać komórki nagłówkowe pionowo, dzięki czemu cała tabela przyjmie bardziej zwarte rozmiary. Warto pamiętać, że nawet w przypadku pionowego ułożenia tekstu elementy takie jak <img> (obrazki) i <iframe> (ramki lokalne) nadal będą ułożone w...
- HTML dla zielonych / Edytory HTML
...narzędzie do porównywania plików oraz wyszukiwania i zamiany w wielu plikach jednocześnie. Przydatną funkcją jest także próbnik kolorów ekranu, tabela znaków ASCII oraz sprawdzanie pisowni. Linux Bluefish (darmowy) ★★★☆☆ Oprócz wersji dla systemu Windows (opis powyżej) edytor ten dostępny jest także dla Linuksa. Brackets (darmowy) ★★★★☆ Oprócz wersji dla systemu Windows (opis powyżej) edytor ten dostępny jest także dla Linuksa. gedit (darmowy) ★★★☆☆ Oficjalny edytor środowiska...
- Szablon strony na DIV-ach / Semantyczny szablon strony
...CSS przynajmniej w stopniu zadowalającym? Dlaczego do tworzenia szablonów stron nie należy używać tabelek: Tabele służą do prezentacji danych tabelarycznych, a nie do tworzenia szablonów - jest to poważny błąd semantyczny. Zwiększają rozmiary dokumentów (dłuższe wczytywanie i wyższe opłaty za transfer). Znacznie ograniczają możliwości stylizacji za pomocą CSS. Utrudniają odbiór treści przez osoby niewidome oraz użytkowników przeglądarek tekstowych. Zwykle wpływają negatywnie na...
- Ikony (symbole) / Typowe akcje
Możesz szybko wyszukać dowolną ikonę używając w tym celu specjalnego generatora. Wybierz wariant ikony, a następnie kliknij przycisk "Pobierz". Możesz dopasować kolor i rozmiar przy użyciu kontrolek znajdujących się w nagłówku tabeli. Nazwa Wariant Koło konta account_circle account_circle Informacje info info Widoczność visibility visibility Miesiąc kalendarza calendar_month calendar_month Harmonogram schedule schedule Ostrzeżenie warning warning Pomoc help help Język language...
- Ikony (symbole) / Formatowanie tekstu
Możesz szybko wyszukać dowolną ikonę używając w tym celu specjalnego generatora. Wybierz wariant ikony, a następnie kliknij przycisk "Pobierz". Możesz dopasować kolor i rozmiar przy użyciu kontrolek znajdujących się w nagłówku tabeli. Nazwa Wariant Opis description description Kopia treści content_copy content_copy Pulpit nawigacyjny dashboard dashboard Edytuj notatkę edit_note edit_note Książka menu menu_book menu_book Widok siatki grid_view grid_view Lista list list Folder folder...
- HTML5 / Zdarzenia HTML5
...elementów w obrębie strony. Zdarzenia te stanowią podstawę dla budowy bardziej dynamicznych i responsywnych interfejsów użytkownika. Poniższa tabela zawiera zestawienie nazw zdarzeń, elementów i obiektów do których mają one zastosowanie oraz opisu momentu ich uruchomienia. Zdarzenie Zastosowanie Opis DOMContentLoaded Document Uruchamia się, gdy parser zakończy przetwarzanie dokumentu Document. afterprint Window Uruchamia się w Window po zakończeniu drukowania...