tabeli - Kurs HTML i CSS
Układ wielokolumnowy CSS / Multi-column layout...spore wady, które praktycznie dyskwalifikują takie rozwiązanie: Inaczej niż w prawdziwym, gazetowym układzie strony, tekst z końca jednej kolumny tabeli nie przechodzi automatycznie na początek kolejnej, umieszczonej po jej prawej stronie. Po zmianie wielkości lub rodzaju czcionki, tekst w kolumnie tabeli ułoży się w zupełnie inny sposób - najprawdopodobniej wysokość przestrzeni zajmowanej przez tekst w kolumnach nie będzie identyczna. Na niewielkich ekranach - np. telefonów komórkowych...
Tabele HTML / Zagnieżdżanie tabel...Dzięki konstrukcji zagnieżdżania tabel, możliwe jest zbudowanie wielu tabel "jedna w drugiej". Tabele wewnętrzne znajdują się w komórkach tabeli zewnętrznej. Zauważ, że w składni polecenia powyżej, tabela podrzędna jest bardziej wcięta (przesunięta w prawo) niż nadrzędna. Nie jest to konieczne, ale bardzo ułatwia tworzenie i czytanie kodu, dlatego polecam używanie takiego sposobu wpisywania. Przykład <table, tr, td> komórka1A komórka1B komórka1C komórka1D komórka2...
- Rozmiary CSS / Szerokość i marginesy automatyczne
...<div style="text-align: left; margin-left: auto; width: 400px; margin-right: auto">...</div> </div> Sposób ten jest przydatny np. do centrowania tabeli (względem elementu BODY stanowiącego blok obejmujący) zgodnie z zaleceniami CSS. <html> <head>...</head> <body style="text-align: center"> <table style="margin-left: auto; margin-right: auto; text-align: left">...</table> </body> </html> 4. Elementy blokowe, zastępowane Przykład: IMG, INPUT, TEXTAREA, SELECT, OBJECT - z ustawionym...
- Tryb Quirks / Co zmienia przejście z trybu Quirks do trybu zgodności ze standardami?
...Opera. We wcześniejszych wersjach Internet Explorera przedstawiony wyżej model określania rozmiarów wg CSS odnosi się tylko do szerokości komórek tabeli, ale nie do ich wysokości. Wcześniejsze wersje MSIE nie stosowały tych zasad również w ogóle dla tabeli o rozplanowaniu stałym ("fixed"). We wcześniejszych wersjach MSIE własność padding nie miała zastosowania do znacznika <img>. W trybie Quirks element body odzwierciedla przestrzeń, w której jest wyświetlany dokument. Szerokość tego...
Tabele HTML / Ćwiczenia...ćwiczeń z poprzedniego rozdziału. Umieść na stronie tabelę. Jeżeli tworzysz stronę o sobie, może to być np. lista Twoich ulubionych filmów. W tabeli możesz umieścić następujące kolumny: Gatunek Tytuł filmu Rok produkcji Ocena (w skali od 1 do 10) Odpowiednio oznacz komórki nagłówkowe tabeli za pomocą znaczników TH. Oddziel nagłówek tabeli od jej właściwej zawartości za pomocą znaczników THEAD i TBODY. Postaraj się, aby przynajmniej jeden gatunek zawierał kilka różnych filmów...
- Szablon strony na DIV-ach / Semantyczny szablon strony
...nazw elementów występujących w treści (nie dotyczy trybu Quirks). Dlaczego nie tabele? Kiedyś do tworzenia szablonów stron WWW używało się tabeli. W czasach, gdy o CSS można było tylko pomarzyć, był to jedyny sposób na stworzenie bardziej skomplikowanej strony. Czy dzisiaj ten powód jest dobrym uzasadnieniem, skoro wszystkie popularne przeglądarki graficzne od dawna obsługują CSS przynajmniej w stopniu zadowalającym? Dlaczego do tworzenia szablonów stron nie należy używać tabelek...
- Formularze HTML / Przykład formularza HTML
...formularz", aby zobaczyć szybki efekt, bez wysyłania danych) Aby ustalić dokładne położenie pól formularza, zwykle umieszcza się je w komórkach tabeli. W ten sposób możliwe jest np. ustawienie opisów w lewej kolumnie, a samych pól w równej odległości po prawej (nie dotyczy to pól wyboru, opcji itp., do których użytkownik nie może wpisywać tekstu). Jeśli zrobimy to bez tabeli, pola będą poukładane nierówno z powodu różnej długości opisów. Na przykład po wpisaniu: <form...
- Komendy HTML 4.01 / CAPTION
Opis nagłówkowy tabeli (należy go umieszczać bezpośrednio po znaczniku otwierającym TABLE). Zobacz więcej... Atrybuty: ALIGN="ustawienie" Pozycja nagłówka w stosunku do tabeli (zdeprecjonowane): bottom - na dole tabeli left - po lewej right - po prawej top - na górze CLASS="klasa" Przypisuje nazwę klasy (CSS) lub nazwy klas do elementu, które muszą być rozdzielone białymi znakami DIR="kierunek" Kierunek tekstu: ltr - od lewej do prawej rtl - od prawej do lewej ID="nazwa...
- Czcionki CSS / Wariant liczb czcionki {font-variant-numeric}
...{ font-variant-numeric: warianty } Selektorem może być dowolny znacznik, w którym można wpisywać tekst, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "warianty" należy podać konkretne ustawienia formatowania liczb w tekście. Możliwe są tutaj dwa sposoby: normal - domyślne ustawienia Dowolna liczba poniższych wartości rozdzielonych spacjami: ordinal - liczba porządkowa, np. w języku angielskim wyraz first (co oznacza: pierwszy) możemy...
- Marginesy CSS / Górny margines wewnętrzny {padding-top}
selektor { padding-top: rozmiar } Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "rozmiar" należy podać konkretną wartość w jednostkach długości. Polecenie to pozwala zdefiniować dodatkowy wewnętrzny odstęp pomiędzy elementami, np. tekstem i obramowaniem tabeli (co nie byłoby możliwe poprzez ustalenie marginesu - margin). Jest przydatne np. w połączeniu z tłem pod tekstem, obramowaniem, czy też...