WPROWADZENIE Kurs DO WIT INTERNETU WSISIZ Wyższa Szkoła Informatyki Stosowanej i Zarządzania WIT

Wielkość: px

Rozpocząć pokaz od strony:

Download "WPROWADZENIE Kurs DO WIT INTERNETU WSISIZ Wyższa Szkoła Informatyki Stosowanej i Zarządzania WIT"

Judyta Tomczyk
8 lat temu
Przeglądów:

1 Serwis WWW Definicja? Ogólna - zbiór infrmacji ujętych w specyficzną frmę dkumenty HTML sieć dnśników - publikwany w sieci Internet (WWW) Infrmatyczna - zbiór plików tekstwych HTML - umieszczny na serwerze (WWW) HTML (XHTML) Definicja? HTML - HyperText Markup Language - Dkument HTML plik tekstwy z rzszerzeniem htm lub html - Elementy składni HTML: znaczniki atrybuty struktura - Specyfikacje HTML (XTML) Przeglądarki Internetwe (interpretacja!!!) Hypertext Definicja? - idea - tekst + dnśniki - nawigacja - układ nieliniwy 1

zbiór plików tekstwych HTML - umieszczny na serwerze (WWW) HTML (XHTML) Definicja?

2 Znaczniki pisu gólnej struktury strny html infrmuje że zawartść dczytywaneg pliku t kd HTML <html> cała strna </html> head wyznacza nagłówek strny <head> nagłówek </head> bdy zawiera pzstałą część strny <bdy> treść właściwa </bdy> Ogólna struktura strny <html> <head> - Infrmacje pisujące strnę - Niewidczne dla użytkwnika </head> <bdy> - Treść właściwa - Widczna knie przeglądarki </bdy> </html> 2

pzstałą część strny <bdy> ----- treść właściwa ----- </bdy> Ogólna struktura strny <html> <head> - Infrmacje

3 UWAGA! Pniższy materiał uwzględnia składnię pisaną w specyfikacji HTML 4.0 (1997). W dalszej części kursu przedstawine zstaną elementy nwszych standardów. Pniższy kurs dtyczy tylk wybranych znaczników, nie należy g traktwać jak kmpletnej specyfikacji. Nagłówek <head> Tytuł Strny <title> Tytuł strny </title> - napis ten ukazuje się w górnej belce przeglądarki - ddatkwe znacznie wyszukiwarki - właściwy dbór!!! <title> Oldtimer club stara mtryzacja</title> Znaczniki META <meta name="descriptin" cntent="pis zawartści strny"> <meta name="descriptin" cntent="strna miłśników starej mtryzacji"> <meta name="keywrds" cntent="pis strny - słwa kluczwe"> - słwa kluczwe hasła pisujące strnę - wypisujemy ddzielając przecinkami <meta name="keywrds" cntent="ldtimer, klub, mtryzacja, aut, stara, samchdy, zlty"> <meta http-equiv="cntent-type" cntent="text/html; charset=kdwanie"> - techniczny pis zawartści strny - kdwanie znaków!!! <meta http-equiv="cntent-type" cntent="text/html; charset=iso "> <meta name="authr" cntent="imie i nazwisk"> <meta name="authr" cntent="paweł Zawadzki"> 3

Nagłówek <head> Tytuł Strny <title> Tytuł strny </title> - napis ten ukazuje się w górnej belce przeglądarki - ddatkwe znacznie wyszukiwarki - właściwy dbór!

4 Ciał dkumentu <bdy> Tł dkumentu Klr tła <bdy bgclr="klr"> - definicje klrów: szesnastkwy zapis RGB #rrggbb nazwa klru (angielska) - źródła definicji prgramy graficzne edytry HTML palety klrów <bdy bgclr="#ff0000"> <bdy bgclr="red"> Tł z pliku graficzneg <bdy backgrund="sciezka_d_pliku"> - typy plików: gif, jpg (rzmiar!!!) - ścieżki względne - kpiwanie plików - pwtarzanie tła <bdy backgrund="tł_mercedes.gif"> <bdy backgrund="brazki\tł_mercedes.gif"> Tekst na strnie Tekst bezpśredni w ciele dkumentu Tekst wystarczy umieścić w sekcji <bdy> Centrwanie <center>frd</center> Nwa linia Linia pzima <hr> 4

$plików: gif, jpg (rzmiar!!!) - ścieżki względne - kpiwanie plików - pwtarzanie tła <bdy backgrund="tł_mercedes.gif"> <bdy backgrund="brazki\tł_mercedes.$

5 Paragraf fiat - blki teksu zamknięte w paragrafy mżemy dwlnie rzmieszczać - atrybut align decyduje wyrównaniu paragrafu w pzimie fiat Frmat tekstu Czcinka <fnt face="krój czcinki" size="wielkść czcinki" clr="klr czcinki"> mercedes benz </fnt> - face - krój czcinki np. Verdana, Arial - size wielkść czcinki wartść d 1 d 7 - clr klr czcinki RGB lub nazwa <fnt face="verdana, arial" size="5" clr="red"> mercedes benz </fnt> Właściwści Tekst pgrubiny pel Tekst pchylny pel Tekst pdkreślny pel pel UWAGA! Frmatwanie tekstu w pierwszej klejnści przensimy d kaskadwych arkuszy stylów!!! 5

Verdana, Arial - size wielkść czcinki wartść d 1 d 7 - clr klr czcinki RGB lub nazwa <fnt face="verdana, arial" size="5" clr="red"> mercedes benz </fnt> Właściwści Tekst

6 Grafika na strnie Obrazy w treści strny <img src="sciezka_d_pliku" alt="pis pliku"> - ścieżka względna - alt pis brazka przeglądarki tekstwe gdy nie mżna wyświetlić brazka dymek <img src="mercedes_123.jpg" alt="mercedes w123 rcznik 1978"> <img src="brazki/mercedes_123.jpg" alt="mercedes w123 rcznik 1978"> Wielkść brazka <img src="sciezka_d_pliku" alt="pis pliku" width="...%" height="..."> - wartści dla width i height pdajemy w pikselach lub prcentach - wielkść brazka najlepiej ustawiać w prgramach graficznych <img src="mercedes_123.jpg" width="100%" height="50"> Odnśniki (nawigacja) Linki d plików lkalnych <a href="sciezka_d_pliku">treść dnśnika</a> - treść dnśnika mże stanwić tekst lub plik graficzny <img...> - ścieżka d pliku względna!!! - href wskazuje cel linku <a href="mercedes_w123.htm">mercedes beczka</a> <a href="mercedes/mercedes_w123.htm">mercedes beczka</a> Linki d plików zewnętrznych <a href="sciezka_d_zasbu" target="...">treść dnśnika</a> - dnśnik mże wskazywać na dwlny adres url - wskazane jest twarcie takiej witryny w nwym knie target="_blank" <a href=" target="_blank">autmbilista</a> 6

..%" height="..."> - wartści dla width i height pdajemy w pikselach lub prcentach - wielkść brazka najlepiej ustawiać w prgramach graficznych <img src="mercedes_123.

7 Odnśnik d adresu <a href ="mailt:adres_ @pczta.pl">kntakt</a> - dnśnik uruchamia dmyślny prgram pcztwy - użytkwnik musi mieć sknfigurwaneg klienta pczty!!! - zalecana jest strżnść w publikwaniu w ten spsób adresów - uwaga na rbty internetwe <a href="mailt:inf@ldtimer.cm.pl">autmbilista</a> Odnśniki w brębie jedneg dkumentu Nazwanie miejsca w dkumencie <a name="miejsce_na_strnie">miejsce</a> - dnśnika a z atrybutem name nie widać na strnie - tak nazwane miejsce na strnie mże stać się celem dnśnika <a name="sbwe"> samchdy sbwe... </a> Odnśnik d miejsca w dkumencie <a href="#miejsce_na_strnie">treść linku</a> - tak sknstruwany dnśnik wskazuje nazwane miejsce na strnie - mżemy także wskazać knkretne miejsce w innym dkumencie <a href="#sbwe">samchdy sbwe</a> <a href="samchdy.htm#sbwe">samchdy sbwe</a> Odnśnik d różnych typów plików <a href ="plik_binarny">zdjęcie</a> - mżemy twrzyć dnśniki d plików dwlneg typu - jeżeli przeglądarka nie będzie mgła twrzyć daneg typu pliku uruchminy zstanie mechanizm pbierania <a href="zdjecie.jpg">plik JPG</a> <a href="zestawienie.pdf">plik PDF</a> <a href="dkument.dc">plik MS WORD</a> <a href="paczka.zip">archwium ZIP</a> <a href="prgram.exe">plik wyknywalny</a> 7

pl">autmbilista</a> Odnśniki w brębie jedneg dkumentu Nazwanie miejsca w dkumencie <a name="miejsce_na_strnie">miejsce</a> - dnśnika a z atrybutem name nie widać na strnie - tak nazwane miejsce na

Podobne dokumenty

Lekcja 1:.Powtórka. <head> <title>kurs HTML</title> </head> <body> to jest tresc... </body>

Lekcja 1:.Powtórka. <head> <title>kurs HTML</title> </head> <body> to jest tresc... </body> Lekcja 1:.Pwtórka I Dkument pdzielny jest na dwie sekcje - head (nagłówek) i bdy (część główna dkumentu). W nagłówku, pmiędzy znacznikami umieszcza się infrmacje, które nie są widczne na