Z Wikipedii

Może się przydać, a jak ma wylecieć

Spis treści 1 TABLICE w HTML 2 PRZYKŁAD PROSTEJ TABELI 2.1 Teoria 2.2 Praktyka 3 PRZYKŁAD: USTALANIE SZEROKOŚCI 3.1 KOLORY

[edytuj] TABLICE w HTML

Wszystko jest proste i logiczne.

<table> - znacznik otwierający tabelę "tu zaczyna się definicja tablicy"

</table> - znacznik zamykający tabelę "tu konczy się definicja tablicy"

<tr> - znacznik otwierający nowy wiersz tabeli "tu się zaczyna nowy/następny wiersz tabeli"

</tr> - znacznik zamykający wiersz tabeli "tu się kończy wiersz tabeli"

<td> - znacznik otwierający pojedynczą komorkę tabeli

</td> - znacznik zamykający pojedynczą komorkę tabeli

TEKST mający znaleźć się w komorce musi być zawarty między <td> i </td>

KOMÓRKA musi się znajdować w wierszu tabeli

WIERSZ TABELI musi się znajdować między <table> i </table>

[edytuj] PRZYKŁAD PROSTEJ TABELI

KOMÓRKA 1 WIERSZ 1	KOMÓRKA 2 WIERSZ 1
KOMÓRKA 1 WIERSZ 2	KOMÓRKA 2 WIERSZ 2

Teraz twoja kolej

Hymn królewski-God Save..	Hymn państwowy-O Canada
Hymn królewski-X	Hymn narodowy-Y

hymn1 Hymn2

hymn3 Hymn4

Lekcja 2: Wcięcia

Teraz twoja kolej

Dziękuję, tym razem zrozumiałam i samodzielnie wykonałam obydwa ćwiczenia. Jeśli po "table" nie napisze się: border="1"" tabela nie powstanie, ale na innych stronach widzialam inne określenie po "table". Co ono znaczy? I proszę, udziel mi jeszcze lekcji drugiej (zob. wyżej). Pytałeś o system op. i przeglądarkę: Windows 98 i Internet Explorer. Andrychowska 00:00, 7 lis 2003 (CET)

Nauka musi postępować powoli żeby ci się zawrócić w głowie ;-)

[edytuj] Teoria

Edytując strony w Wikipedii, możemy posługiwać się większością znaczników języka służącego do tworzenia stron internetowych (HTML). Jednak preferowaną metodą jest stosowowanie znaczników własnych Wikipedii, które są o wiele łatwiejsze do zrozumienia (intuicyjne) dla osób bez wykształcenia technicznego (np. ja). Są to wytłuszczenia, italik itd.
W pewnych sytuacjach przy edycji stron Wikipedii nie możemy się obyć bez znaczników HTML (jak to widać przy tworzeniu tabel).

[edytuj] Praktyka

Tworzona przez nas tabela może mieć pewne dodatkowe własności poza ustaleniem ilości wierszy i komórek w wierszach oraz czy ma mieć ramki.

[edytuj] PRZYKŁAD: USTALANIE SZEROKOŚCI

KOMÓRKA 1 WIERSZ 1	KOMÓRKA 2 WIERSZ 1
KOMÓRKA 1 WIERSZ 2	KOMÓRKA 2 WIERSZ 2

KOMÓRKA 1 WIERSZ 1	KOMÓRKA 2 WIERSZ 1
KOMÓRKA 1 WIERSZ 2	KOMÓRKA 2 WIERSZ 2

KOMÓRKA 1 WIERSZ 1	KOMÓRKA 2 WIERSZ 1
KOMÓRKA 1 WIERSZ 2	KOMÓRKA 2 WIERSZ 2

KOMÓRKA 1 WIERSZ 1	KOMÓRKA 2 WIERSZ 1
KOMÓRKA 1 WIERSZ 2	KOMÓRKA 2 WIERSZ 2

W wyżej zamieszczonych przykładach widać jak można ustalić szerokość tabeli.
<table> to tylko znacznik otwierający, można w nim umieścić dodatkowe informacje dotyczące jego właściwości (w tym wypadku te dodatkowe informacje odniosą skutek dla całej tabeli).

width oznacza szerokość, przypisujemy jej wartość procentowo lub w pikselach.

border oznacza ramka, liczba oznacza ilość pikseli. border="0" usunie ramki

align oznacza justowanie tabeli i może mieć np. wartości align="center" czyli tabela wycentrowana. Gdy nie podamy będzie justowana w lewo.

To na razie tyle. Proszę przećwiczyć ten materiał. Jutro klasówka ;-)

'Zadanie domowe'

Hymn1	Hymn2
Hymn3	Hymn4

Hymn1	Hymn2
Hymn3	Hymn4

Hymn1 Hymn2

ax bx

błąd, jeszcze raz:

Hymn1	Hymn2
ax	bx

Moim zamiarem było utworzyć taką tabelę, która jest przedzielona na pół pionowo(czyli osobne komórki to:Hymn1 i Hymn2), natomiast chciałam, aby komórki Hymn1 i Hymn2 miały drugi wiersz pod spodem, czyli aby nie było poziomej kreski - gdzie popełniłam błąd?

Hymn1 ax

Hymn2 bx

Spróbowałam jeszcze raz, wzorowałam się na Twoim trzecim przykładzie.

Z pozostałymi wzorami tabel nie mam kłopotów.

Hymn1	Hymn2
Hymn3	Hymn4

Mam jeszcze jedno pytanie: nie widzę różnicy czy napiszę border="1" czy border="2". Zero przećwiczyłam.

No cóż. Nie wiem, dlaczego moje pytanie "wyszło" w pionie. I pozostał "ogon" w postaci początku tabeli. Andrychowska 15:56, 7 lis 2003 (CET)

Ciekawe, dlaczego w "Edytuj" wszystko wygląda normalnie.

[edytuj] KOLORY

Na początek 2 uwagi na marginesie.
Trzeba uważać jak się wpisuje bo jedna literówka może zepsuć wszystko.
Może jestem purystą, ale wartości lepiej wpisywać w cudzysłowach width="100%" itp

Uwagi co pracy domowej
aby w danej komórce wymusić przejście do nowej linii należy użyć <br/>. Inaczej przejście do nowej linii następuje automatycznie gdy tekst się nie mieści w komórce na szerokość.

Hymn1	Hymn2
Hymn3	Hymn4

Powyższa tabela uzyskała kolor żółty po dodaniu bgcolor="yellow".

Hymn1	Hymn2
Hymn3	Hymn4

Jest pewna liczba predefiniowanych nazw kolorów (po ang.), które można tu użyć. Poza tym można stosować kolory podawane liczbowo np. #99ff66 - są to 3 wartośći, po dwie liczby heksydecymalne dla kolorów: czerwonego zielonego i niebieskiego.

Kolor	tej tabeli
to #99ff66	to #99ff66

Warto używać 216 wartości określanych jako websafe colors, masz wtedy większe prawdopobieństwo, że kolor będzie taki jaki zamierzałaś na komputerach różnych użytkowników.

Nazwy kolorów dopuszczonych i paletę websafe colors znajdziesz w WWW - Wszechnicy Wiedzy Wszelakiej.

Praca domowa - eksperymentuj i baw się dobrze

Polecam stronę webmaster.helion.pl , w dziale "Kolory" znajdziecie ładną rozpiskę kolorów a w dziale "Tabele" obszerny kurs tworzenia tabel w jezyku HTML.