Académique Documents
Professionnel Documents
Culture Documents
PRZYKADOWY ROZDZIA
SPIS TRECI
KATALOG KSIEK
KATALOG ONLINE
ZAMW DRUKOWANY KATALOG
TWJ KOSZYK
DODAJ DO KOSZYKA
CENNIK I INFORMACJE
ZAMW INFORMACJE
O NOWOCIACH
ZAMW CENNIK
CZYTELNIA
FRAGMENTY KSIEK ONLINE
Tworzenie stron
WWW. Kurs
Autor: Radosaw Sok
ISBN: 83-7361-310-2
Format: B5, stron: 320
Zawiera CD-ROM
Wydawnictwo Helion
ul. Chopina 6
44-100 Gliwice
tel. (32)230-98-63
e-mail: helion@helion.pl
Spis treci
Wstp..................................................................................................................................................................................7
Rozdzia 1. Nowa strona WWW .......................................................................................................................13
Pobieranie programu Webber z Sieci ............................................................................... 14
Uruchomienie programu Webber .................................................................................... 15
Wprowadzanie podstawowego kodu strony.................................................................... 16
Ustalanie tytuu strony WWW .......................................................................................... 18
Zapisywanie kodu strony na dysku twardym .................................................................. 19
Otwieranie zapisanej wczeniej strony WWW ................................................................ 21
Wywietlanie strony w przegldarce .................................................................................22
Aktualizowanie strony w przegldarce.............................................................................24
Kopiowanie fragmentu kodu HTML ............................................................................... 25
Wklejanie uprzednio skopiowanego fragmentu kodu HTML ..................................... 26
Wycinanie fragmentu kodu HTML..................................................................................27
Podsumowanie.....................................................................................................................28
Spis treci
Zmiana rozmiaru czcionki ................................................................................................ 51
Zmiana kroju pisma............................................................................................................ 52
Okrelanie marginesw akapitu ........................................................................................ 54
Tworzenie nagwka............................................................................................................ 56
Wstawianie poziomej linii.................................................................................................. 58
Zmiana wygldu poziomej linii ........................................................................................ 59
Lista wypunktowana ........................................................................................................... 61
Zagniedanie listy .............................................................................................................. 63
Lista numerowana ............................................................................................................... 64
Wstawianie znakw specjalnych........................................................................................ 66
Kompletna, prosta strona................................................................................................... 68
Podsumowanie.....................................................................................................................70
Rozdzia 3. Odnoniki..........................................................................................................................................71
Tworzenie odnonika..........................................................................................................72
Tworzenie odnonika pocztowego.................................................................................... 73
Definiowanie domylnego tematu wiadomoci pocztowej........................................... 75
Definiowanie etykiety .........................................................................................................77
Tworzenie odnonika prowadzcego do etykiety ...........................................................78
Tworzenie odnonika prowadzcego do etykiety zadeklarowanej
na innej stronie WWW.....................................................................................................79
Otwieranie odnonika w nowym oknie ........................................................................... 81
Podsumowanie..................................................................................................................... 83
Rozdzia 5. Tabele...............................................................................................................................................133
Jak w jzyku HTML opisuje si tabel ............................................................................ 134
Tworzenie tabeli................................................................................................................. 135
Wprowadzanie tekstu do komrki tabeli....................................................................... 138
Zmiana szerokoci kolumny tabeli................................................................................. 139
Spis treci
Rozdzia 7. Ramki................................................................................................................................................185
Budowa serwisu skadajcego si z ramek ...................................................................... 186
Tworzenie strony podzielonej na ramki ........................................................................ 187
Weryfikowanie podziau na ramki ................................................................................. 190
Tworzenie ramki z tytuem serwisu .................................................................................191
Tworzenie ramki z menu.................................................................................................. 192
Tworzenie ramki z treci................................................................................................. 193
Ustalanie pocztkowej zawartoci ramek....................................................................... 194
Tworzenie odnonika prowadzcego do wybranej ramki ........................................... 196
Tworzenie odnonika otwierajcego nowe okno przegldarki................................... 198
Blokowanie moliwoci zmiany szerokoci ramki.......................................................200
Zmiana obramowania ramki ...........................................................................................202
Tworzenie treci alternatywnej ........................................................................................203
Ramka osadzona................................................................................................................204
Usuwanie obramowania ramki osadzonej.....................................................................206
Podsumowanie...................................................................................................................207
Spis treci
Tworzenie plikw szablonu .............................................................................................229
Tworzenie nowej strony na bazie szablonu ...................................................................232
Generowanie kodu strony na bazie szablonu................................................................ 233
Automatyczne generowanie serwisu WWW.................................................................. 236
Automatyczne wstawianie daty ostatniej aktualizacji strony......................................238
Definiowanie sw kluczowych serwisu .........................................................................239
Definiowanie opisu serwisu .............................................................................................240
Rejestrowanie strony WWW w wyszukiwarkach .......................................................... 241
Podsumowanie...................................................................................................................244
Skorowidz...................................................................................................................................................................307
Tabele
Tabele zazwyczaj kojarz si z wypenion gsto tekstem lub liczbami, podzielon liniami
na wiersze i kolumny kartk papieru; w dokumentach elektronicznych te najczciej
przyjmuj tak posta. Na stronach WWW tabele zyskuj jednak nowe znaczenie cho
mona je wykorzystywa do zapisywania danych, to najczciej su jednak do definiowania
ukadu strony np. dzielenia strony na rnej szerokoci kolumny wypenione tekstem,
na wzr szpalt w gazecie.
Mechanizm tabel jest mocnym punktem jzyka HTML moliwe jest definiowanie
rodzaju obramowania komrek tabeli (bd zrezygnowanie z niego), ustalanie marginesw
komrek tabeli, a nawet zagniedanie tabel (tworzenie tabeli wewntrz komrki innej
tabeli).
Osignicie mistrzostwa w operowaniu tabelami wymaga miesicy cikiej pracy, jednak
po przeczytaniu kilkunastu kolejnych stron powiniene opanowa podstawy tworzenia
i modyfikowania tabel, ktre pozwol Ci samodzielnie poszerza swoj wiedz.
134
Tworzenie tabeli
135
Tworzenie tabeli
Poniej przedstawiem kroki niezbdne do zbudowania najprostszej tabeli, zawierajcej
dwa wiersze po dwie komrki kady. Jeden z wierszy bdzie peni funkcj nagwka
tabeli, drugi za tymczasowo pusty funkcj wiersza danych.
Wyrnianie wiersza penicego funkcj nagwka tabeli nie ma na celu wycznie zmiany
jego wygldu: ten sam efekt wizualny mgby osign rwnie tworzc nagwek w sposb
identyczny, co zwyky wiersz. Jak ju jednak podkrelaem w poprzednich rozdziaach,
rwnie istotna co wygld dokumentu HTML jest jego struktura logiczna.
2
3
1
5
6
7
10
Jeli chcesz, by tabela bya wsza, podaj inn warto atrybutu . Jeli cakowicie pominiesz atrybut , przegldarka nada tabeli minimaln szeroko
pozwalajc na czytelne przedstawienie zawartych w tabeli danych.
136
Tworzenie tabeli
9. Powtrz operacje opisane w punktach 6., 7. i 8. dla drugiej komrki nagwka tabeli.
10. Zamknij element , koczc tym samym opis pierwszego wiersza tabeli. Kod caego
wiersza powinien wyglda mniej wicej w taki sposb:
18
11
13
14
12
16
17
15
Tworzenie tabeli
137
16. Zamknij element , koczc tym samym opis drugiego wiersza tabeli. Kod caego
wiersza powinien wyglda mniej wicej w taki sposb:
17. Zamknij element , koczc tym samym opis caej tabeli.
18. Zapisz wprowadzone zmiany. Kod caej tabeli powinien wyglda w tym momencie
mniej wicej tak:
21
138
2
3. Wprowad now tre komrki
tabeli. Wprowadzany tekst zastpi
podwietlony fragment.
3
5. Uaktywnij okno przegldarki.
6
139
znacznika
lub
otwierajcego komrk tabeli
nalec do wybranej kolumny
tabeli. Komrka ta koniecznie musi
nalee do pierwszego wiersza tabeli.
wzgldn w procentach:
Kolumny, ktrych szeroko nie zostanie rcznie okrelona nadal bd automatycznie rozszerzane lub zwane przez przegldark w zalenoci od ich
zawartoci oraz od szerokoci pozostaych kolumn tabeli.
140
141
3
1
Prawie zawsze uywa si tabel pozbawionych obramowania po prostu wygldaj one znacznie lepiej.
142
atrybutem .
143
4
3
144
145
146
147
2
3
6
7
5. Zamknij element
(lub ),
koczc tym samym opis pierwszej
komrki nowego wiersza tabeli.
148
7. Zamknij element , koczc tym samym opis nowego wiersza tabeli.
8. Zapisz wprowadzone zmiany.
9. Uaktywnij okno przegldarki.
10
11
Jeli po rozbudowaniu kodu tabeli o nowy element tabela dosownie rozpada si, mieszajc zawarto komrek lub koczc si przedwczenie, na pewno
popenie jaki bd w kodzie. W takim przypadku jeszcze raz sprawd, czy
zamkne we waciwej kolejnoci wszystkie elementy jzyka HTML skadajce si na kod tabeli, oraz czy nowo wstawiony kod wiersza tabeli zawiera tyle
samo elementw lub , co pozostae wiersze.
149
2
7
6. Zamknij element
(lub ),
koczc tym samym opis nowej
komrki tabeli.
Jeli chcesz, aby przegldarka automatycznie ustalaa szeroko kolumny, pomi
wprowadzanie atrybutu .
150
11
151
152
Scaleniu niekoniecznie musz podlega tylko dwie komrki tabeli. Moesz scali
ze sob dowoln liczb komrek. Scalajc N komrek tabeli, musisz usun N1
elementw , pozostawiajc w kodzie tylko jeden.
pozostawionego elementu
.
4
5
!
"# $$$$
153
1. W poniszym przykadzie
dokonasz scalenia tych dwch
komrek tabeli.
podwietlony kod.
!
"# $$$$
154
1
2. Podwietl kod atrybutu &$,
5
2
3
4
zmieniajcego element
ze zwykej komrki tabeli
w komrk scalajc.
155
156
157
wycentrowana w poziomie
()."$/. $0) oraz
wyrwnana do grnego marginesu
(, %"$/.&0).
158
159
3
5
6
%=%
%
%
160
7
8
9
12
11
elementu
w drugim wierszu
tabeli (komrka zawierajca menu)
atrybutem ,"$&. Dziki
temu niezalenie od rozmiaru
ssiedniej komrki menu zawsze
bdzie dosunite do grnej
krawdzi komrki.
11. Uczy to samo z drug komrk tego wiersza dziki temu tekst artykuu, nawet
gdyby by niezwykle krtki, zawsze bdzie dosunity do grnej krawdzi komrki.
12. Uzupenij kod prawej komrki drugiego wiersza (komrki zawierajcej tekst artykuu)
atrybutem !"#$% /.
0. Nadasz w ten sposb tej komrce biay
kolor ta.
161
'
%%
%%
%
%'
%%
14
16
17. Wr do edycji kodu strony
w oknie programu Webber.
17
18
21
znacznikami elementu
tworzcego jedyn komrk
pierwszego wiersza tabeli.
20
19
162
22
24
23
25
22. Umie kursor pomidzy znacznikami elementu
tworzcego pierwsz komrk
drugiego wiersza tabeli. Bdzie ona zawiera menu suce do nawigowania po stronach
Twojego serwisu.
23. Aby nada caemu menu jednolity wygld, wprowad kod elementu 425 wraz
z nastpujcymi atrybutami stylu (podanymi jako tre atrybutu ):
)%"$/. $ aby cay tekst menu by wyporodkowany,
*$%*-/.3.$%* aby tekst menu by zoony czcionk bezszeryfow.
%&
@@"
A
@%
Niestety, nie moesz zdefiniowa w tak prosty sposb koloru tekstu caego menu, gdy elementy tworzce odnoniki (niezbdne do zbudowania menu)
anuluj zmiany poczynione w nadrzdnym elemencie.
24. Wprowad tre menu w postaci kolejnych akapitw tekstu (elementy 2)
zawierajcych odnoniki (elementy ). Pamitaj, by kademu elementowi
przyporzdkowa kolor umoliwiajcy odczytanie tekstu na ciemnym tle:
@%
&$"%%
%B C#
@%
$"%%
%*
D
163
26
27
32
28
31
30
29
164
33
35
Podsumowanie
165
Podsumowanie
Tabele stanowi bardzo istotny element jzyka HTML. Wbrew pozorom rzadko su one
do przedstawiania w postaci tabelarycznej zestaww danych. Najczstszym zastosowaniem
tabel jest dzielenie strony na obszary (takie jak obszar nagwka, obszar menu czy obszar
treci) wypenione rnorodnym tem.
Tworzc tabele, pamitaj o kilku zasadach:
kod tabeli wprowadza si zawsze wiersz po wierszu,
kady wiersz tabeli (element ) zawiera kilka komrek (elementy
lub ),
w tabeli niezawierajcej scalonych komrek liczba komrek w kadym wierszu
powinna by identyczna,
komrka scalona obejmujca N wierszy lub N kolumn odpowiada N odrbnym
elementom
lub , zatem tworzc scalon komrk naley usun nadmiarowe
komrki tabeli wraz z ich zawartoci,
bdny kod tabeli najczciej owocuje efektem rozsypywania si tabeli pojawiaj
si puste wiersze lub kolumny, komrki nachodz na siebie lub te tabela urywa si
nagle i przeksztaca w zwyky tekst.