Scribd Logo
Upload

Welcome to Scribd!

  • Lekcija 5

    Uploaded by

    admir_ado
    19 views11 pages

    Original Title

    Lekcija 5.doc

    Copyright

    © © All Rights Reserved

    Available Formats

    DOC, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    © All Rights Reserved
    Download as DOC, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    19 views11 pages

    Lekcija 5

    Uploaded by

    admir_ado

    Copyright:

    © All Rights Reserved
    Download as DOC, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 11

    Lekcija 5

    Sada je pravo vrijeme da popričamo o rezoluciji monitora. Moguće su različite


    rezolucije, a najčešće korištene su 640×480, 800×600 i 1024×768. Ima li ova priča
    ikakve veze sa web dizajniranjem? Naravno da ima!

    Veoma je važno kako će ono što Vi napravite u Vašoj rezoluciji od, npr, 1024×768
    izgledati nekome ko koristi rezoluciju 640×480 (i obrnuto). Kao primjer neka Vam
    posluže tri donje slike iste prezentacije, ali na različitim rezolucijama.

    640×480 800×600 1024×768

    Veoma je dobra ideja provjeriti svoje strane na drugim rezolucijama (naravno, i na


    drugim browser-ima i operativnim sistemima). Vaša pažljivo skrojena prezentacija
    može izgledati... recimo, vrlo čudno na drugim rezolucijama! Ovo se naročito odnosi
    na prezentacije rađene na višim rezolucijama. Pogledajte tako urađenu prezentaciju
    u nižoj rezoluciji, i može se desiti da budete vrlo, vrlo iznenađeni.

    Pređimo na neke alatke za formatiranje teksta. Prva je <BLOCKQUOTE>. U većini


    browsera, ovaj tag će dodati margine sa strane.

    <BODY BGCOLOR="#FFFFFF">
    <BLOCKQUOTE>
    Kompjuter, ili računar, predstavlja sklop visokotehnoloških komponenti (hardware)
    oplemenjenih programima (software) sa zajedničkim ciljem da se omogući masovna
    obrada podataka, bavljenje grafičkim dizajnom, praćenje tehnološkog procesa
    proizvodnih programa, upravljanje komunikacionim sistemima itd.
    </BLOCKQUOTE>
    </BODY>
    Sljedeća korisna alatka su liste. One mogu biti ORDERED liste ili UNORDERED liste.

    Ovo je ordered lista Ovo je unordered lista


    1. nešto  crveno
    2. još nešto  plavo
    3. i ovo  belo
    4. i kraj  zeleno

    Prvo ćemo videti kako se pravi UNORDERED lista. Vrlo je jednostavno...


    Ovo je početak.
    <BODY BGCOLOR="#FFFFFF">
    Šta želim za rođendan?
    </BODY>

    Pažnja - mi zapravo još nismo počeli da pravimo listu... ovo je samo nekakav
    naslov...

    Dodajmo odgovarajuće tagove.


    <BODY BGCOLOR="#FFFFFF">
    Šta želim za rodjendan?
    <UL>
    </UL>
    </BODY>

    Dodajmo element liste...


    <BODY BGCOLOR="#FFFFFF">
    Šta želim za rođendan?
    <UL>
    <LI>nov PC
    </UL>
    </BODY>

    Dodajmo još elemenata


    <BODY BGCOLOR="#FFFFFF">
    Šta želim za rođendan?
    <UL>
    <LI>nov PC
    <LI>brz gliser
    <LI>1.000.000 $
    <LI>ostrvo na Pacifiku
    <LI>Ferrari
    </UL>
    </BODY>

    Napravili ste listu!

    Kako se pravi ordered lista? Lako! Samo treba promeniti <UL> tag u <OL>.

    <BODY BGCOLOR="#FFFFFF">
    Šta želim za rođendan?
    <OL>
    <LI>nov PC
    <LI>brz gliser
    <LI>1.000.000 $
    <LI>ostrvo na Pacifiku
    <LI>Ferrari
    </OL>
    </BODY>

    Osim ove dvije, postoji i DEFINICIONA lista, koja bi mogla da izgleda ovako...
    modem...
    uređaj koji omogućava komunikaciju udaljenim računarima
    miš.........
    uređaj koji omogućava pokretanje kursora na ekranu
    itd...........
    i tako dalje

    Počnimo rad...
    <BODY BGCOLOR="#FFFFFF">
    <DL>
    </DL>
    </BODY>

    Dodajmo definicioni naslov...


    <BODY BGCOLOR="#FFFFFF"><DL>
    <DT>Definicija kompjutera
    </DL>
    </BODY>

    Dodajmo element liste.


    <BODY BGCOLOR="#FFFFFF">
    <DL>
    <DT>Definicija kompjutera
    <DD>Kompjuter, ili računar, predstavlja sklop visokotehnoloških komponenti
    (hardware) oplemenjenih programima (software) sa zajedničkim ciljem da se
    omogući masovna obrada podataka, bavljenje grafičkim dizajnom, praćenje
    tehnološkog procesa proizvodnih programa, upravljanje komunikacionim sistemima
    itd.
    </DL>
    </BODY>
    Na kraju bi bilo lijepo podebljati naslov. To, naravno, nije obavezno, ali tako izgleda
    mnogo ljepše.

    <BODY BGCOLOR="#FFFFFF">
    <DL>
    <DT><B>Definicija kompjutera</B>
    <DD>Kompjuter, ili računar, predstavlja sklop visokotehnoloških komponenti
    (hardware) oplemenjenih programima (software) sa zajedničkim ciljem da se
    omogući masovna obrada podataka, bavljenje grafičkim dizajnom, praćenje
    tehnološkog procesa proizvodnih programa, upravljanje komunikacionim sistemima
    itd.
    </DL>
    </BODY>

    Sljedeća korisna stvar je horizontalna linija.

    <BODY BGCOLOR="#FFFFFF">
    <HR>
    </BODY>
    I u ovom slučaju postoji nekoliko dodatnih opcija...
    <BODY BGCOLOR="#FFFFFF">
    <HR WIDTH=20%>
    <HR WIDTH=50%>
    <HR WIDTH=100%>
    <HR WIDTH=20>
    <HR WIDTH=50>
    <HR WIDTH=100>
    </BODY>

    Liniju možemo postaviti lijevo, desno ili je centrirati.


    <BODY BGCOLOR="#FFFFFF">
    <HR WIDTH=60% ALIGN=LEFT>
    <HR WIDTH=60% ALIGN=RIGHT>
    <HR WIDTH=60% ALIGN=CENTER>
    </BODY>
    Možemo da kontrolišemo i debljinu linije (default vrijednost je 2), kao i boju linije.

    <BODY BGCOLOR="#FFFFFF">
    <HR WIDTH=60% SIZE=1>
    <HR WIDTH=60% SIZE=3 COLOR="RED">
    <HR WIDTH=60% SIZE=8>
    <HR WIDTH=60% SIZE=15>
    </BODY>

    Takođe, linija može biti i popunjena...


    <BODY BGCOLOR="#FFFFFF">
    <HR WIDTH=60% SIZE=1 NOSHADE>
    <HR WIDTH=60% SIZE=3 NOSHADE>
    <HR WIDTH=60% SIZE=8 NOSHADE>
    <HR WIDTH=60% SIZE=15 NOSHADE>
    </BODY>
    Svakako se sjećate da browseri ne razumiju formatiranje teksta bez tagova, tj. da
    tekst prikazuju u jednoj ravnoj liniji. Otprilike ovako (napomena - koristićemo font
    Courier New)...

    <BODY BGCOLOR="#FFFFFF">
    <font face="courier new" size="3">
    \|/
    (@ @)
    +----oOO----(_)-----------+
    | Z o N e . W e b ! |
    | *** |
    | Uvod u HTML |
    +-----------------oOO-----+
    |__|__|
    || ||
    ooO Ooo
    </BODY>

    Međutim, sa <PRE> (preformatirano) tagom, možemo da dobijemo rezultat, koji će


    izgledati baš onako kako smo otkucali!
    <BODY BGCOLOR="#FFFFFF">
    <PRE>
    \|/
    (@ @)
    +----oOO----(_)-----------+
    | Z o N e . W e b ! |
    | *** |
    | Uvod u HTML |
    +-----------------oOO-----+
    |__|__|
    || ||
    ooO Ooo
    </PRE>
    </BODY>

    Obratite pažnju na to da je korišten font Courier New (može i Times New Roman),
    fiksne širine (tt).

    Posljednji tag koji ćemo ovde koristiti je komentar tag, koji služi za
    komentarisanje :-).
    <BODY BGCOLOR="#FFFFFF">
    <!--Ovo jeste komentar-->
    Ovo nije<P>
    Komentar može da se nalazi bilo gdje u HTML fajlu, a browseri će ignorisati sve što
    se nalazi unutar zagrada taga. Ovaj tag možete koristiti za dodavanje skrivenih
    poruka<!--Zdravo, svima!-->, nekih podsjetnika za sebe<!—Kako napraviti web
    stranicu-->, ili možete dodati neke korisne savjete onima koji gledaju Vaš Document
    source<!—Ovu stranicu je lako napraviti!!!-->.
    </BODY>
    Da bi bilo potpuno jasno, treba naglasiti da komentar mora početi sa <!-- i završiti
    sa -->
    Između njih, možete staviti sve što želite - čitave pasuse, druge tagove... Browser će
    jednostavno ignorisati sve dok ne nađe -->

    You might also like