OSNOVE HTML

1.      Sedaj bomo naredili svojo domačo stran. V TextPadu najprej ustvarimo datoteko mojastran.html . V glavo (med znački <HEAD> in </HEAD>) vstavimo vrstico: <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1250"> , s čemer dosežemo, da bodo delovali tudi šumniki.

2.      Na vrhu strani napiši svoje ime in priimek ter ga z značkami <Hn> postavi na primerno velikost.

3.      Ime in priimek postavi v odstavek (znački <P> </P>) in poravnaj na sredino zaslona (parameter ALIGN).

4.      Za imenom in priimkom pusti 2 prazni vrstici. Nato z značko <HR> izriši ravno črto. Ali prikazovalnik upošteva prazne vrstice? Kako ga prisilimo, da jih bo upošteval?

5.      Napiši kratek življenjepis, ki naj vsebuje kraj in datum rojstva, kraje, kjer si živel(-a), šole, ki si jih obiskoval(-a) in jih še obiskuješ... Besedilo spravi med znački <P> in </P>, torej v odstavek. S parametrom ALIGN preizkusi razne poravnave ostavka.

6.      S pomočjo značk <B> in </B> poudari kraj rojstva,  s pomočjo značk <I> in </I> zapiši datum rojstva kurzivno, s pomočjo značk <U> in </U> podčrtaj naziv svoje osnovne šole.

7.      Nad naziv fakultete, katero sedaj obiskuješ (verjetno Fakulteto za matematiko in fiziko) s pomočjo značk <A> in </A> postavi povezavo na stran na naslovu http://fmf.uni-lj.si .

8.      Pusti dve prazni vrstici. Ker smo na Fakulteti za metamatiko in fiziko, se spodobi, da znaš na svoji strani napisati tudi kako formulo (samo za vajo...). Napiši naslednje izraze:

a0 = 1, a1 = 2, an = an-1 + a2n-2 .

Pomagaj si z značkami <SUB> in </SUB> za indekse in <SUP> ter </SUP> za eksponente.

9.      Na delovnem področju ustvari mapo slike. Na internetu najdi sliko naše fakultete ter še kako tebi zanimivo sliko. Obe sliki shrani v mapo slike. Kakšni končnici imata datoteki s slikama?

10.  S pomočjo značke <IMG> vstavi obe sliki v dokument. Pri tem upoštevaj, da se sliki nahajata v mapi slike. Kako lahko spreminjaš velikost slike?

11.  Na sliko naše fakultete postavi povezavo na stran FMF.

12.  Na delovnem področju naredi podpodročje test. Vanj prekopiraj datoteko mojastran.html . Oglej si to datoteko v pregledovalniku. Ali se vidijo slike? Če se ne, zakaj ne?

13.  Ko želimo shraniti kako internetsko stran s slikami v Internet Explorerju uporabimo menu File|Save As. Ali nam to shrani tudi slike? Kam jih shrani?Pazi vsi internetski pregledovalniki se ne obnašajo enako.

14.  Na svojo spletno stran dodaj tabelo najpomembnejših tel.številk. V prvem stolpcu naj bo ime, v drugem pa tel. številka.

SLIKE

 

1.      Pripravi stran v HTML kot album. Vsebuje naj vsaj 6 slik na izbrano temo. Vsaka slika naj ima pojasnilo. Ob kliku na sliko naj se odpre nova stran, kjer bo ta ista slika v formatu GIF in v formatu JPEG z vsaj 3 različnimi stopnjami stiskanja. Ob vsaki sliki napiši stopnjo stiskanja in velikost. Primer takega albuma (tvoj naj ne bo v tabeli) lahko vidiš npr. na

 

http://rc.fmf.uni-lj.si/matija/predavanja/2000-2001/rpRM/domnal/markovic/index.html

http://rc.fmf.uni-lj.si/matija/predavanja/2000-2001/rpRM/domnal/vodiskar/KLIMT.HTML

 

  1. Vse slike, ki si jih uporabil pri prejšnji nalogi, daj v podimenik al_slik. Ustrezno popravi svojo HTM datoteko. Na ustrezen način zloži vse potrebne datoteke v album.zip. To datoteko prepiši na disketo in jo daj sosedu. Ta naj jo razpakira na poljubno mesto na svojem računalniku. Ali vidi slike pravilno?

 

  1. Če še niso, vse slike opremi z ALT določilom. V pregledovalniku, ki ga uporabljaš, izklopi prikazovanje slik. Ali se vsebina polja ALT kje izpiše? Kako lahko sliko vidiš (je potrebno spreminjati nastavitve?)

 

  1. Še vedno naj bo prikaz slik izklopljen. Pripravi HTML datoteko, v kateri imaš dvakrat isto sliko. Prvič jo opremi s pravimi merami (WIDTH in HEIGHT), drugič pa ti polji spusti. Kakšna je razlika pri prikazu slike?

 

  1. Sestavi HTML datoteko, kjer bo na vrhu strani vedno debela modra črta, ki bo zavzemala srednji dve četrtini širine okna.

 

  1. Sestavi album, kjer bodo na levi strani slike živali, desno pa njihovi opisi. Ti naj bodo tako dolgi, da zavzemajo vsaj tri vrstice pri maksimalni velikosti okna pregledovalnika.

 

  1. Oglej si povezave

 

1.        http://wdvl.com/Authoring/HTML/Tutorial/images.html 

2.        http://www.ijp.si/tomo/work/courses/seminar98/All/orbanic/html5.htm 

3.        http://htmlprimer.com/lesson5.shtml 

  1. Na straneh

si oglej, če lahko velikost spletnega albuma, ki si ga ustvaril, kaj zmanjšaš?

 

 

TABELE

 

  1. S pomočjo tabele sestavi spletno stran, na kateri imaš svoj urnik. Primera najdeš npr. na http://vlado.fmf.uni-lj.si/vlado/urnik00b.htm in http://www.educa.fmf.uni-lj.si/www375/2000/ProgOpr/urnik.htm
  2. Sestavi tabelo barv. V prvem stolpcu naj bo številska koda barve, v drugem pa barva sama.
  3. Tvoja spletna stran naj ne presega širino 500 točk. Uporabi tabelo, da to dosežeš.
  4. V prikazovalnikih naj se tvoja spletna stran pokaže tako, da bo (če je dovolj prostora), levo in desno enako praznega prostora.
  5. Nalogo slike/6 napravi ponovno, le da naj bodo tokrat slike živali v levem stolpcu, njihovi opisi pa v desnem.
  6. S pomočjo tabele naredi spletno stran, kjer bo na levi strani kazalo, na desni pa se bodo prikazovale ustrezne strani.
  7. Oglej si povezave

 

UREJEVALNIKI, PREGLEDOVALNIKI

 

1.      Oglej si strani z opisi urejevalnikov:

 

  1. http://wdvl.com/Vlib/Authoring/HTML_Editors.html 
  2. CUTE HTML 
  3. HTML Kit 

 

2.      S pomočjo spletnih mest, ki preverjajo kodo, poišči napake v svojih HTM datotekah