Tworzenie stron internetowych www World Wide Web

1
Tworzenie stron internetowychwwwWorld Wide Web

• Jezyk HTML
• czyli
• Hyper Text Markup Language
• Opracowal
• Dr inz. Zbigniew Rudnicki

2

• Co to jest HTML ?
• Jezyk do tworzenia dokumentów, które po
  umieszczeniu na serwerze WWW beda dostepne dla
  uzytkowników Internetu na calym swiecie jako
  strony (witryny) WWW
• Jak zapisywane sa szczególy m.in. wygladu strony?
• Przy pomocy rozkazów zwanych tagami a
  umieszczanych w nawiasach katowych lt gt. Jesli
  dotycza fragmentu tekstu to wystepuja w postaci
  pary obejmujacej ten tekst, np.
• ltBgt ten tekst bedzie widac jako wytluszczony lt/Bgt
• Jakie najprostsze narzedzia wystarcza nam na
  poczatek?
• NOTATNIK lub inny prosty edytor czystego
  tekstu
• dowolna przegladarka Internetu np. Internet
  Explorer

3

• Caly dokument objety jest tagami ltHTMLgt ...
  lt/HTML gt i zawiera 1) glowe dokumentu miedzy
  tagami ltHEADgt .. lt/HEADgt 2) cialo dokumentu
  miedzy tagami ltBODYgt .. lt/BODYgt A oto
  najprostszy szablon dokumentu z polskimi literami
  w standardzie Ms Windows
• ltHTMLgt
• ltHEADgt
• ltmeta http-equiv"Content-Type"
  content"text/html charsetwindows-1250"gt
• ltTITLEgt Tytul, który pojawi sie w pasku u góry
  lt/TITLEgt
• lt/HEADgt
• ltBODYgt
• tresc dokumentu . . . . . . . . . . . . . .
• lt/BODYgt
• lt/HTMLgt

4
Formatowanie tytulów

• ltH1gt Tytul glówny (najwiekszy) lt/H1gt
• ltH2gt Tytul drugiego poziomu lt/H2gt
• ltH3gt Tytul trzeciego poziomu lt/H3gt
• ltH4gt Tytul czwartego poziomu lt/H4gt
• . . . . . . . . . .

5

• Akapit tekstu (odsuniety od innych akapitów)
• ltPgt tekst lt/Pgt
• Zmiana linii wewnatrz akapitu
• tekst ltBRgt nowa linia tekstu
• Wycentrowanie tekstu
• ltCENTERgt tekst lt/CENTERgt
• Formatowanie cech czcionki tekstu
• ltBgt ten tekst bedzie wytluszczony lt/Bgt
• ltIgt ten tekst bedzie pochylony lt/Igt
• ltUgt ten tekst bedzie podkreslony lt/Ugt

6

• Lista wypunktowana
• ltULgt
• ltLIgt temat 1
• ltLIgt temat 2
• ltLIgt . . . .
• lt/ULgt
• Lista numerowana
• ltOLgt
• ltLIgt punkt 1
• ltLIgt punkt 2
• ltLIgt . . . .
• lt/OLgt

7

• Odsylacze (tzw. LINKI) do innych dokumentów
• Odsylacz do dokumentu istniejacego w tym samym
  folderze
• ltA HREFnazwa_plikugt Tekst odsylacza lt/Agt
• na przyklad
• ltA HREFzadania.htmgt Zadania z fizykilt/Agt

8

• Odsylacze dokumentów na innych komputerach
  (serwerach)
• ltA HREFhttp//nazwa_komputera/dokumentgt tekst
  lt/Agt
• Na przyklad
• Odsylacz do dokumentu dydak.htm na serwerze adam
• ltA HREFhttp//adam.imir.agh.edu.pl/dydak.htmgt
  Nauczanie lt/Agt

9

• Wstawianie obrazkówltimg srcnazwa_pliku_z_obraz
  kiem"gt IMG jest skrótem od Image (obraz), SRC
  jest skrótem od Source (zródlo).Na przyklad
  ltimg srckwiatek.gif"gt

10
Tabele

• Definicja tabeli zawarta jest miedzy
  znacznikamiltTABLE border n gt ... lt/TABLEgt
• gdzie n - szerokosc linii siatki
• opis wiersza (ang.row) ltTRgt ... lt/TRgt
• opis komórki danych w wierszu ltTDgt ... lt/TDgt
• Przyklad tabeli majacej 1 wiersz i 2 kolumny