HTML Tutorial
Prikazujem rezultate 1 do 18 od 18

Tema: HTML Tutorial

  1. #1
    Primećen član
    Učlanjen
    19.09.2007.
    Pol
    muški
    Lokacija
    Lost Heaven
    Poruke
    846
    Reputaciona moć
    0

    Podrazumevano HTML Tutorial

    Verovatno će Vam biti drago da znate da je ovo sve veoma jednostavno. Ovo bi bila osnovna ideja... Web strana nije ništa drugo do fajl, i to HTML fajl, da budem precizan. Zove se HTML, jer web dokumenti imaju ekstenziju .html ili .htm. HTML je skraćenica od Hyper Text Mark-up Language. (Ako ne znate otkud ovi nastavci, onda mora da ste potpuni početnik. Kliknite ovde za "brzinsko" upoznavanje sa vrstama fajlova!).

    Počnimo! Prvo, ako imate ijedan od onih cool HTML editora, i upravo se spremate da ga startujete... zaboravite ih potpuno! Najgori način za učenje je korišćenje nekog od tih editora. (Naravno, neki od njih mogu biti vrlo korisni, ali tek kad savladate osnove.) Pa, dobro, šta je najbolje za učenje HTML-a? MS Notepad!!! Verujte mi. OK? OK.

    Druga "alatka" koja će Vam trebati je browser za razgledanje web strana. Ja preporučujem Netscape Navigator ili Internet Explorer, koji stiže uz većinu Windows-a. Oba bi trebalo da obave posao sasvim dobro.


    Sad kad smo utvrdili sve to, mogu vam reći da ste na samo pet minuta od svoje prve web strane.

    * Pitanje: Šta je Notepad i gde mogu da ga nađem?
    Odgovor:
    Notepad je Windows-ov default tekst editor. Na vecini Win9x sistema, kliknite dugme Start i izaberite Programs, pa Accessories. Tu bi trebalo da se nalazi mala plava svešcica - Notepad. Medjutim, za naše potrebe svaki tekst editor je dobar. Sa Interneta možete skinuti gomilu zgodnih, malih editora, ali je Notepad za sad sasvim dovoljan.

    Postoji jedna stvar koju biste trebali da izbegavate - korišćenje tekst procesora (kao što je MS Word) za pravljenje HTML dokumenata. Razlog - format u kome se dokument snima u tekst procesorima ne odgovara web browserima. Po mom mišljenju, ovo pravilo bi trebalo da se primenjuje i na tzv. "Internet-friendly" Word 2000.


    Pokrenite Notepad i počnite sa ovim...
    <HTML>
    </HTML>

    Ovo su HTML tagovi. Postoje početni i krajnji tag. Da bi ste napravili krajnji tag, samo dodajte / u početni tag. Veliki broj tagova ima i krajnji tag (ali ne svi!).
    Razmišljajte o tagovima kao o razgovoru sa browser-om, ili kao o načinu izdavanja instrukcija browser-u. Ono što ste malopre napisali browser "shvata" kao 'Ovo je početak HTML dokumenta' (<HTML>) i 'Ovo je kraj HTML dokumenta' (</HTML>). Naravno, između ćemo dodati još ponešto.

    _______________________________________________

    U svakom HTML dokumentu mora se naći i par HEAD tagova.
    <HTML>
    <HEAD>
    </HEAD>
    </HTML>
    _____________________________________________

    Sledeća stvar koja bi trebala da se doda u HEAD je naslov (TITLE).
    <HTML>
    <HEAD>
    <TITLE></TITLE>
    </HEAD>
    </HTML>
    _______________________________________________

    Glavni deo HTML dokumenta nalaziće se između BODY tagova.
    <HTML>
    <HEAD>
    <TITLE></TITLE>
    </HEAD>
    <BODY>
    </BODY>
    </HTML>
    ________________________________________________

    U TITLE tagove ukucajte ime vase stranice.
    A u BODY tagove kucate ono sto zelite da pise na vasoj Web Stranici.

    <HTML>
    <HEAD>
    <TITLE>Moja prva web strana</TITLE>
    </HEAD>
    <BODY>
    Mala Web skola!
    </BODY>
    </HTML>

    ________________________________________________
    Sada treba dokument snimiti, i to ne kao tekstualni, vec kao HTML dokument. Snimite ga kao PAGE1.HTML u neki novi folder.

    Čestitam! Postali ste ponosni vlasnik potpuno funkcionalne web strane! Mogli biste da je postavite na neki server (npr. kod Vašeg Internet provajdera, ili na neki besplatni server, kao što su, npr., AngelFire, Homestead ili WebJump), tako da čitav svet može da vidi vaših ruku delo!

    Možete je dvaput kliknuti i videti šta ste uradili. Ako želite da vidite kako vaša strana zaista treba da izgleda, pogledajte ovde.
    Poslednji put ažurirao/la Lord Of Midnight : 04.10.2008. u 16:55



  2. #2
    Primećen član
    Učlanjen
    19.09.2007.
    Pol
    muški
    Lokacija
    Lost Heaven
    Poruke
    846
    Reputaciona moć
    0

    Podrazumevano Re: HTML Tutorial

    Ovde ću Vam odmah reći nešto, što možda neće biti baš najjasnije... U pitanju su naša slova - š, đ , č , ć, ž. Da biste ih videli, u glavu (HEAD) HTML dokumenta dodajte sledeći red:

    <meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
    ili
    <meta http-equiv="Content-Type" content="text/html; charset=]iso-8859-2
    Ukoliko želite da koristite ćirilicu, sve što treba je da u gornjem redu vrednost 1250 zamenite sa 1251. Naravno, i tastaturu morate da prebacite na srpsku latiničnu (hrvatsku, slovenačku) odn. na srpsku ćiriličnu! Za sad Vam preporučujem da koristite samo engleska slova. Kad to savladate, lako ćete preći i na naša slova.
    ________________________________________

    Da bi stvari izgledale jasnije, pisaću samo <BODY> tag. Izostaviću sve <HTML>, <HEAD> i <TITLE> tagove. Naravno, podrazumeva se da ćete ih vi pisati u svojim HTML-dokumentima.<BODY>
    </BODY>
    ________________________________________

    Otkucajte neki kratak tekst.
    <BODY>
    neki kratak tekst
    </BODY>

    Kad god uradite neku promenu u vašem dokumentu, snimite ga, pa pritisnite dugme Reload/Refresh na browser-u, da bi ste videli najnoviju verziju. Nekad to neće biti baš dovoljno (čudne su zverke ti browser-i). U tom slušaju primenite SuperReload (shift+Reload) - naravno, ovo važi samo za Netscape.
    ________________________________________

    Prvo treba da naučimo kako se menja boja pozadine. Ova siva deluje prilično bezveze. (Napomena - siva nije uvek default - predefinisana boja.)
    <BODY BGCOLOR="#FFFFFF">
    neki kratak tekst
    </BODY>

    FFFFFF je bela boja na "kompjuterskom" jeziku. Ovde se nalazi još nekoliko boja.
    Netscape (i ostali browser-i) sve slike prebacuju na svoju paletu od 256 boja. Dalje, ukoliko izaberemo boju koja nije u toj paleti, browser će automatski umesto nje prikazati najbližu. U ovom trenutku to nije baš važno; no, ako Vas boje baš interesuju, kliknite ovde, gde ćete bolje upoznati ovaj obojeni problem.
    ____________________________________

    Naravno, umesto boje, za pozadinu možete da uzmete i neku sliku. (Obratite pažnju da ona zasad treba da bude u istom folderu u kome se nalazi i Vaš HTML fajl.)
    <BODY BACKGROUND="swirlies.gif">
    neki kratak tekst
    </BODY>

    Da bi se slika prikazala, browser mora da bude u mogućnosti da je nađe. Za sada, slika treba da bude u istom folderu u kome se nalazi i Vaš HTML dokument (PAGE1.HTML). Najlakši način da to izvedete je da desnim tasterom miša kliknete na sliku i izaberete Save Image As (ili tako nešto, što zavisi od browser-a). Zatim, sliku snimite u folder u kome je Vaš HTML fajl. Kasnije ćemo "detaljisati".
    _____________________________________

    Očigledno je da je slika ponovljena više puta (tile) da bi se uklopila u veličinu ekrana. Ako, pak, koristite dugu, a tanku sliku, efekat će biti ovakav...
    <BODY BACKGROUND="bluebar.gif">
    neki kratak tekst
    </BODY>


  3. #3
    Primećen član
    Učlanjen
    19.09.2007.
    Pol
    muški
    Lokacija
    Lost Heaven
    Poruke
    846
    Reputaciona moć
    0

    Smile Re: HTML Tutorial

    _______________________________

    Dobro. Vratimo se sada čistom, belom ekranu.
    <BODY BGCOLOR="#FFFFFF">
    neki kratak tekst
    </BODY>
    _______________________________

    Sada bismo mogli da stvari malo podebljamo.
    <BODY BGCOLOR="#FFFFFF">
    neki kratak<B>tekst</B>
    </BODY>
    _______________________________

    Princip je isti i za ukošena slova (italic).
    <BODY BGCOLOR="#FFFFFF">
    neki <I>kratak</I> <B>tekst</B>
    </BODY>
    _______________________________

    Naravno, to važi i za podvlačenje (underline).
    <BODY BGCOLOR="#FFFFFF">
    <U>neki</U> <I>kratak</I> <B>tekst</B>
    </BODY>
    _______________________________

    Vratimo se na čist beli ekran.
    <BODY BGCOLOR="#FFFFFF">
    neki kratak tekst
    </BODY>

    ___________________________________

    Ako želimo, tagovi se često mogu koristiti u raznim kombinacijama.
    <BODY BGCOLOR="#FFFFFF">
    neki kratak <I><B>tekst</B></I>
    </BODY>

    Ovo je primer ugnežđenih tagova. Ukoliko ćete koristiti kombinacije tagova (a sigurno hoćete), onda, da ne bi ste zbunjivali browser-e, koristite ugnežđene, a ne preklopljene tagove. Primer sledi...
    <OVO>
    <ONO></OVO></ONO> preklopljeni tagovi.... loše
    <OVO><ONO></ONO></OVO> ugnežđeni tagovi.... dobro
    _______________________________

    Veoma je interesantan i font fiksne dužine.
    <BODY BGCOLOR="#FFFFFF">
    <TT>neki kratak tekst</TT>
    </BODY>

    ]Svako slovo zauzima jednaku količinu horizontalnog prostora.

    Ovo je običan tip ->[/FONT] iiiiiiiiii
    oooooooooo
    mmmmmmmmmm
    Ovo je font fiksne dužine ->
    iiiiiiiiii
    oooooooooo
    mmmmmmmmmm

  4. #4
    Primećen član
    Učlanjen
    19.09.2007.
    Pol
    muški
    Lokacija
    Lost Heaven
    Poruke
    846
    Reputaciona moć
    0

    Podrazumevano Re: HTML Tutorial

    Takođe možemo da menjamo i veličinu fonta... i to veoma jednostavno!Prvo dodajmo par <FONT> tagova...
    <BODY BGCOLOR="#FFFFFF">
    neki kratak <FONT>tekst</FONT>
    </BODY>

    Onda odredimo vrednost atributa SIZE.<BODY BGCOLOR="#FFFFFF">
    neki kratak <FONT SIZE=6>tekst</FONT>
    </BODY>

    Postoji 7 veličina fontova:
    malecni mali obični srednji veliki oho-ho veliki i džinovski!
    1 2 3 4 5 6 7
    Dve napomene. Prva: <TAG> govori browser-u da uradi nešto. Međutim, ATRIBUTE ide u <TAG> i govori browser-u kako da uradi to što zahtevate.
    Druga napomena se tiče podrazumevanih vrednosti (default). Kao što verovatno znate, default je vrednost koju browser pretpostavlja, ako niste naglasili drugačije. Dobar primer je veličina fontova. Podrazumevana veličina je 3. Ako nije drugačije naglašeno, ona će zaista i biti 3.

    Svaki browser ima podešene podrazumevane fontove - ime, veličinu i boju. Ukoliko niste ništa "prčkali", podrazumevani font je Times New Roman od 12pt (što u HTML-u iznosi 3), crne boje. Naravno, ukoliko želite, u svom HTML dokumentu možete koristiti i druge fontove. Kao, npr.

    [FONT=ARIAL]ARIAL[/FONT] ili [FONT=VERDANA]VERDANA[/FONT].

    <BODY BGCOLOR="#FFFFFF">
    neki kratak <FONT FACE="ARIAL">tekst</FONT>
    </BODY>

    Veoma važno!!!
    Font će se videti samo ako posmatrač ima instaliran taj font na svom računaru! Ukoliko to nije slučaj, tekst će biti predstavljen podrazumevanim (default) fontom. Zato, oprez sa fontovima! Uz Windows, veoma su česti fontovi Arial i Verdana. Takođe i Impact!. Da bi se ovo delimično prevazišlo, možete navesti više od jednog fonta - ovako...

    <FONT FACE="ARIAL, HELVETICA, VERDANA">Zdravo</FONT>

    Malo objašnjenje... Browser traži font ARIAL. Ako ga nađe, koristi ga. Ako ne, onda traži sledeći navedeni font - HELVETICA. Ako ga ne nađe, tražiće VERDANA. E, ako ne nađe ni taj font, onda će koristiti podrazumevani (default) font.
    Da biste videli kako različiti fontovi mogu da izgledaju u vašem browser-u, pogledajte [FONT=Arial]Handy Dandy Font Viewer[/FONT] [ © J. Barta ].
    ______________________________________

    OK. Nazad na interesantne stvari.
    Ako želite, možete da promenite i boju fonta.


    <BODY BGCOLOR="#FFFFFF">
    neki kratak <FONT COLOR="#FF0000">tekst

    Poslednji put ažurirao/la Lord Of Midnight : 04.10.2008. u 17:40

  5. #5
    Primećen član
    Učlanjen
    19.09.2007.
    Pol
    muški
    Lokacija
    Lost Heaven
    Poruke
    846
    Reputaciona moć
    0

    Podrazumevano Re: HTML Tutorial

    Unutar jednog taga možemo koristiti više atributa...
    <BODY BGCOLOR="#FFFFFF">
    neki kratak <FONT COLOR="#FF0000" FACE="ARIAL" SIZE="7">tekst</FONT>
    </BODY>
    __________________________________

    <BODY BGCOLOR="#FFFFFF">
    neki kratak <U><I><B><FONT COLOR="#FF0000" FACE="ARIAL" SIZE="7">tekst</FONT></B></I></U>
    </BODY>

    Još jedanput bih naglasio da tagovi treba da budu ugnežđeni, a ne preklopljeni.

    <TAG3><TAG2><TAG1>E-heej!</TAG1></TAG2></TAG3>

    Redosled tagova nije uopšte važan.
    __________________________________

    Još jedna stvar pre kraja ove lekcije. Browser ima podrazumevana podešavanja za boju teksta, linkova, aktivnih linkova, posećenih linkova, kao i za boju pozadine. Te podrazumevane vrednosti su:

    Tekst je crn
    Linkovi su plavi
    Aktivni linkovi su crveni
    Posećeni linkovi su ljubičasti

    Ukoliko želite, ove podrazumevane vrednosti mogu se lako menjati. Kao prvo, moguće je uneti promenu za ceo HTML dokument. Evo kako...

    <BODY BGCOLOR="#00000" TEXT="#FFFF00" LINK="#FF0000" VLINK="#800000" ALINK="#008000">
    neki kratak tekst
    </BODY>

    Ovde se nalazi i koristan programčić - Color PickerJoe Barta) koji olakšava (i čini interesantnim) eksperimentisanje bojama. Uz pomoć ColorPicker-a možete ne samo da birate boje, već i da menjate vrste i veličine fontova, da isprobavate kako bi izgledala podebljana ili ukošena slova, a možete da se igrate i sa slikama za pozadinu. ColorPicker će automatski generisati <BODY> tag.
    ___________________________________________

    Eto! Sada znate skoro sve u vezi sa manipulisanjem tekstom u Vašim dokumentima. Sada bez problema možete napraviti velika crvena slova ili mala podebljana slova. Možete koristiti i [FONT=ARIAL]razne vrste fontova[/FONT], ili FONT FIKSNE ŠIRINE.
    Osim toga, moguće je napraviti i tzv. rollercoaster!

    HTML kôd za "rollercoaster" izgleda ovako (ako Vas interesuje).
    ]Pre nego što završimo ovu lekciju, želeo bih da vam skrenem pažnju na još jednu sitnicu. HTML kôd bilo koje stranice može se jednostavno videti - pritisnite View/Source na Vašem browser-u. Dakle, ako prilikom web-surfa naletite na neku finu stranu, i zapitate se "Kako li je ovo urađeno?", znajte da je odgovor udaljen samo nekoliko klikova Vašeg miša.

  6. #6
    Primećen član
    Učlanjen
    19.09.2007.
    Pol
    muški
    Lokacija
    Lost Heaven
    Poruke
    846
    Reputaciona moć
    0

    Smile Re: HTML Tutorial

    Ovu lekciju ćemo početi malim objašnjenjem kako browser-i rade.
    Prvo, jedan primer...

    <BODY BGCOLOR="#FFFFFF">
    neki kratak tekst
    o HTML-u

    </BODY>

    <BODY BGCOLOR="#FFFFFF">
    neki
    kratak
    tekst
    o HTML-u

    </BODY>

    Browser ne prepoznaje formatiranja u tekstu. Ukoliko ne naglasite drugačije, sav tekst će biti napisan u jednom redu. Ako želite da počnete novi red, moraćete da koristite odgovarajući tag.

    <BODY BGCOLOR="#FFFFFF">
    neki
    <BR>kratak
    <BR>tekst
    <BR>o HTML-u
    </BODY>

    <BR> u osnovi znači naredbu počni novi red. Sličan tagu <BR> je i tag <P>. Ovaj tag označava početak novog pasusa, uz efekat prelaska u novi red i preskakanja jednog reda.
    <BODY BGCOLOR="#FFFFFF">
    neki
    <P>kratak
    <P>tekst
    <P>o HTML-u</BODY>


    Napomena o <P> tagu: ne može se koristiti više puta. Drugim rečima, <P><P><P> obično neće predstavljati gomilu praznih redova, već samo jedan prazan red. Zašto? Kako dodati više praznih redova? Odgovor stiže!
    Pogledajmo sledeći primer...
    <BODY BGCOLOR="#FFFFFF">
    neki kratak tekst
    </BODY>



    Browser ne prepoznaje više od jedne praznine. Možda to deluje čudno, ali je tako. Važno je da Vam to daje bolju kontrolu nad tekstom.
    Naravno postoji tag, koji za browser predstavlja prazno mesto-> &nbsp;
    Probajte ovo...
    <BODY BGCOLOR="#FFFFFF">
    neki&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp ;
    kratak&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp ;
    tekst
    </BODY>

    Znak & znači početak nekog specijalnog znaka, dok ; označava kraj. Slova između predstavljaju skraćenicu tog specijalnog znaka! Postoji veliki broj takvih znakova. Evo nekoliko često korišćenih... (Pažnja: obavezno koristite MALA SLOVA)

    • &nbsp; (jedno prazno mesto)
    • &lt; (< manje od)
    • &gt; (> veće od)
    • &amp; (&)
    • &quot; (" navodnici)
    • ­crtica)

    Naravno, postoji još mnogo specijalnih karaktera. Ako Vas interesuju, možete ih videti ovde.
    Ovo će Vas možda malo zbuniti. Ako pritisnete Enter dok kucate, browser će to (obično) shvatiti kao razmak... osim ako razmak već postoji (tad će novi razmak biti ignorisan).
    Još jedan kratak primer...
    <BODY BGCOLOR="#FFFFFF">
    neki<BR>kratak<BR>tekst<BR>
    o<BR>HTML-u
    </BODY>

    Jasno? Nadam se da jeste. Ja bolje ne znam da objasnim.
    ________________________________________

    Sledeći tag je vrlo koristan. Ime mu govori za sebe.
    <BODY BGCOLOR="#FFFFFF">
    <CENTER>neki kratak tekst</CENTER>
    </BODY>

    Moguće je centrirati jednu reč ili celu stranicu - sve između <CENTER> tagova biće centrirano.
    ___________________________________

    Pređimo na stavljanje slika na web strane. Koristićemo ovaj grb Beograda. Dakle, kliknite desnim tasterom miša, pa sliku snimite u odgovarajući folder.

    Za stavljanje slika, koristi se <IMG> tag.
    <BODY BGCOLOR="#FFFFFF">
    <IMG>
    </BODY>

    __________________________________

    Takođe, moramo odrediti izvor (source) i veličinu slike.
    <BODY BGCOLOR="#FFFFFF">
    <IMG SRC="grb.jpg" WIDTH=124 HEIGHT=150>
    </BODY>



    Ovde moram naglasiti da atribut src ne pokazuje samo koja je slika u pitanju, već i gde se ona nalazi. Dijagrami koji slede, trebalo bi da Vam razjasne korišćenje ovog atributa, ako želimo da stavimo sliku koja se, npr, zove "chef.gif".
    SRC="chef.gif" znači da se slika nalazi u istom folderu u kome je i HTML dokument, koji je poziva.

    SRC="images/chef.gif" znači da se slika nalazi u folderu ispod HTML dokumenta koji je poziva. Pitanje je: koliko nivoa ispod? Onoliko koliko je potrebno (a u našem slučaju - jedan)!

    SRC="../chef.gif" znači da je slika u folderu iznad HTML dokumenta koji je poziva.

    SRC="../../chef.gif" znači da je slika dva foldera iznad HTML dokumenta koji je poziva.

    SRC="../images/chef.gif" znači da je slika jedan folder gore, pa jedan dole u odnosu na HTML dokument.

    SRC="../../../other/images/chef.gif" - nadam se da sami shvatate šta ovo znači.

    Postoji i drugi način. Naime, moguće je i korišćenje kompletnih putanja (URL-ova). Na primer: http://www.neka_adresa.net/~ja-na-netu/LottzaStuff/other/images/chef.gif Zašto, pitate se Vi, ima više smisla koristiti relativne (delimične) URLove, nego apsolutne (kompletne) URLove? Zato što tako možete napraviti svoj sajt lokalno (na svom hard-disku), a svi linkovi će normalno funkcionisati. Kada završite sve strane, ceo sajt možete da upload-ujete na server (a da sve i dalje radi normalno). Novo pitanje bi bilo: postoji li, onda, razlog da koristimo apsolutne URLove? Naravno, i to kada se slike nalaze na potpuno drugom serveru.

  7. #7
    Primećen član
    Učlanjen
    19.09.2007.
    Pol
    muški
    Lokacija
    Lost Heaven
    Poruke
    846
    Reputaciona moć
    0

    Smile Re: HTML Tutorial

    Sledeći atribut IMG taga koji treba pomenuti je ALT...
    <IMG SRC="grb.jpg" WIDTH=124 HEIGHT=150 ALT="Grb Beograda!">
    ALT predstavlja zamenu za sliku, kada posetilac sajta ne vidi slike (iz bilo kog razloga). Neko može da koristi čist tekstualni browser; neko je možda isključio prikazivanje slika da bi brže surfovao (kako se to radi? - u Netscape-u pritisneš Options pa skloniš potvrdu sa Auto Load Images), itd. U takvim slučajevima, atribut ALT može biti veoma važan Vašim posetiocima.
    Još malo o veličini slika.
    Probajte ovo...

    <BODY BGCOLOR="#FFFFFF">
    <IMG SRC="grb.jpg">
    </BODY>
    ____________________________________________

    Kao što vidite, browser može i sam da odredi veličinu slike. Zašto se onda gnjavimo sa dimenzijama? Razlog je jednostavan - to omogućava browser-u brže učitavanje slike.

    Šta je tu najinteresantnije? Pazi sad...
    <BODY BGCOLOR="#FFFFFF">
    <IMG SRC="grb.jpg" WIDTH=300 HEIGHT=175>
    </BODY>

    <BODY BGCOLOR="#FFFFFF">
    <IMG SRC="grb.jpg" WIDTH=40 HEIGHT=200>
    </BODY>

    Možete definisati bilo koju veličinu za sliku, nevezano za njenu pravu veličinu. Ako Vam nije jasno, pogledajte šta sve može da se uradi sa ovom malom, crvenom tačkom -> <- (zapravo, to je slika, dimenzija 1×1).

    <BODY BGCOLOR="#FFFFFF">
    <IMG SRC="red_dot.gif" WIDTH=510 HEIGHT=1><P>
    <IMG SRC="red_dot.gif" WIDTH=510 HEIGHT=2><P>
    <IMG SRC="red_dot.gif" WIDTH=510 HEIGHT=5><P>
    <CENTER><IMG SRC="red_dot.gif" WIDTH=2 HEIGHT=200></CENTER>
    </BODY>
    _______________________________________________

    Vreme je da naučimo pravljenje linkova.
    To je zaista veoma jednostavno. Napravimo link na Yahoo.
    Počnimo ovako...

    <BODY BGCOLOR="#FFFFFF">
    Posetite Yahoo!
    </BODY>
    _________________________________________

    Onda ćemo dodati par ANCHOR tagova (tzv. sidra).
    <BODY BGCOLOR="#FFFFFF">
    Posetite <A>Yahoo!</A>
    </BODY>

    ______________________________________________

    Dodajte URL i gotovo! URL je skraćenica od Universal Resource Locator (to znači univerzalni lokator), što zapravo znači web adresa.
    <BODY BGCOLOR="#FFFFFF">
    Posetite <A HREF="http://www.yahoo.com/">Yahoo!</A>
    </BODY>
    ________________________________________

    Napravimo još jedan.
    <BODY BGCOLOR="#FFFFFF">
    Posetite Netscape!
    </BODY>
    _______________________________________

    <BODY BGCOLOR="#FFFFFF">
    Posetite <A HREF="http://home.netscape.com/">Netscape!</A>
    </BODY>
    _________________________________________

    Link za e-mail radi vrlo slično. Jedina razlika je to što se umesto web adrese koristi e-mail adresa.
    <BODY BGCOLOR="#FFFFFF">
    Posalji mi <A HREF="mailto:hej@zdravo.co.yu">mail!</A>
    </BODY>
    ________________________________________

    Moguće je koristiti i slike kao linkove. Kako? Vrlo lako: potrebno je staviti <IMG> tag umesto odgovarajuće reči.
    <BODY BGCOLOR="#FFFFFF">
    Posetite <A HREF="http://www.beograd.org.yu"><IMG SRC="grb.jpg" WIDTH=120 HEIGHT=175></A>
    </BODY>
    Kod:
     PITANJE:  Kako mogu da se oslobodim one ružne plave linije oko slike-linka?
    
    ODGOVOR:  Prosto... samo dodaj BORDER=0 u IMG tag. (Vidi dole!)  
    _______________________________________

    <BODY BGCOLOR="#FFFFFF">
    Posetite <A HREF="http://www.beograd.org.yu"><IMG SRC="grb.jpg" WIDTH=120 HEIGHT=175 BORDER=0></A>
    </BODY>

    Još jedna stvar u vezi sa linkovima... Sasvim je prihvatljivo napraviti link na nečiju web stranu bez pitanja. Linkovi su ono što Mrežu čini Mrežom!

  8. #8
    Primećen član
    Učlanjen
    19.09.2007.
    Pol
    muški
    Lokacija
    Lost Heaven
    Poruke
    846
    Reputaciona moć
    0

    Podrazumevano Re: HTML Tutorial

    Pređimo na još neke alatke za formatiranje teksta. Prva je <BLOCKQUOTE>. U većini browsera, ovaj tag će dodati margine sa strane. (Ne znam da li je to baš prava terminologija, ali nadam se da shvatate pojentu.)
    <BODY BGCOLOR="#FFFFFF">
    <BLOCKQUOTE>
    Definicija: 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>
    ___________________________________

    Sledeća korisna alatka su liste. One mogu biti ORDERED liste ili UNORDERED liste (ne znam kako bi ovo trebalo da se prevede na srpski, ali mislim da ćete shvatiti o čemu se radi).

    Ovo je ordered lista


    1. nešto
    2. još nešto
    3. i ovo
    4. i kraj


    Ovo je unordered lista


    • crveno
    • plavo
    • belo
    • zeleno

    Prvo ćemo videti kako se pravi UNORDERED lista. Vrlo je jednostavno...Ovo je početak.
    <BODY BGCOLOR="#FFFFFF">
    Šta želim za rodjendan?
    </BODY>
    _________________________________

    Dodajmo odgovarajuće tagove.
    <BODY BGCOLOR="#FFFFFF">
    Šta želim za rodjendan?
    <UL>
    </UL>
    </BODY>
    _____________________________

    Dodajmo element liste...
    <BODY BGCOLOR="#FFFFFF">
    Šta želim za rodjendan?
    <UL>
    <LI>nov PC
    </UL>
    </BODY>
    _____________________________

    Dodajmo još elemenata (budimo neskromni!)
    <BODY BGCOLOR="#FFFFFF">
    Šta želim za rodjendan?
    <UL>
    <LI>nov PC
    <LI>brz gliser
    <LI>1.000.000 $
    <LI>ostrvo na Pacifiku
    <LI>Leticiju Kastu *
    </UL>
    </BODY>
    (* devojke - i mladići sa takvim sklonostima: slobodno upišite Leonardo DiKaprio, npr.)
    ___________________________

    Kako se pravi ordered lista? Lako! Samo treba promeniti <UL> tag u <OL>.
    <BODY BGCOLOR="#FFFFFF">
    Šta želim za rodjendan?
    <OL>
    <LI>nov PC
    <LI>brz gliser
    <LI>1.000.000 $
    <LI>ostrvo na Pacifiku
    <LI>Leticiju Kastu
    </OL>
    </BODY>
    _____________________________

    Kako se pravi ordered lista? Lako! Samo treba promeniti <UL> tag u <OL>.
    <BODY BGCOLOR="#FFFFFF">
    Šta želim za rodjendan?
    <OL>
    <LI>nov PC
    <LI>brz gliser
    <LI>1.000.000 $
    <LI>ostrvo na Pacifiku
    <LI>Leticiju Kastu
    </OL>
    </BODY>

  9. #9
    Primećen član
    Učlanjen
    19.09.2007.
    Pol
    muški
    Lokacija
    Lost Heaven
    Poruke
    846
    Reputaciona moć
    0

    Smile Re: HTML Tutorial

    Ako vas zanima kako se prave Web Stranice, sada ste u prilici da naucite osnove HTML-a.
    Programa za izradu Web Stranica. Samo da napomenem da ovo nije kompletan HTML ima jos dosta stvari, ali ovo vam je dovoljno da namestite Web Stranicu i da je okacite na neki hosting kako bi svi mogli da je vide...
    Ukoliko imate nekih problem ili vam nesto nije jasno pitajte ovde.

  10. #10
    Ističe se
    Učlanjen
    04.01.2008.
    Pol
    muški
    Lokacija
    localhost
    Poruke
    2.842
    Reputaciona moć
    65

    Podrazumevano Re: HTML Tutorial

    Svaka cast za ovo Lorde. Imas nekoliko reputacionih poena od mene

  11. #11
    Peruzzi nije na forumu
    је дошао тихо и ушао у легенду...
    Domaćin Peruzzi (avatar)
    Učlanjen
    03.08.2003.
    Pol
    muški
    Lokacija
    Shumadija
    Poruke
    3.924
    Reputaciona moć
    92

    Podrazumevano Re: HTML Tutorial

    sad ce valjda biti smislenijih pitanja a ne "kako da stavim sliku u veb stranicu?"

    doduse, trebalo bi okaciti i krace uputstvo za upload sajta, al dobro sad


  12. #12
    Ističe se
    Učlanjen
    04.01.2008.
    Pol
    muški
    Lokacija
    localhost
    Poruke
    2.842
    Reputaciona moć
    65

    Podrazumevano Re: HTML Tutorial

    Vidis I to je pohvano,konstruktivan predlog Cenimo to

  13. #13
    Primećen član Gill Bates (avatar)
    Učlanjen
    11.05.2003.
    Pol
    muški
    Lokacija
    Bgd
    Poruke
    603
    Reputaciona moć
    60

    Podrazumevano Re: HTML Tutorial

    Lorde covece, imam ozbiljne primedbe:

    1) zasto nisi preporucio charset=utf-8
    2) predlazes uzastopne space-ove sa
    beskonacnim ponavljanjem &nbsp; To se radi recimo sa <label style="width:300px;">&nbsp;</label>
    3) Nisi dao ljudima link na spisak specijalnih karaktera. Evo recimo ovde
    4)
    <IMG SRC="grb.jpg" WIDTH=300 HEIGHT=175> nije pravilno i nece ti proci ni kroz jedan HTML validator. Pravilno je <IMG SRC="grb.jpg" WIDTH="300" HEIGHT="175" />
    Ergo, vrednosti atributa moraju biti pod navodnicima.
    5) Da li je moguce da ti u svaki image link stavljas BORDER="0". To se radi kroz CSS:
    a img{border:0;text-decoration:none;}

    6) za OL nisi objasnio atribut START


    No hard feelings!
    Linux is like a wigwam. No gates, and Apache inside!

  14. #14
    Zainteresovan član
    Učlanjen
    03.01.2009.
    Pol
    muški
    Lokacija
    Zaječar, Dedinje
    Poruke
    222
    Reputaciona moć
    35

    Podrazumevano Re: HTML Tutorial

    ovako...Napravio sam html website preko notepad-a,(ustvari skinuo sam html template sa neta i menjao xD) I kako sad da dodam neki website widget???

  15. #15
    Zainteresovan član blubokiz (avatar)
    Učlanjen
    24.07.2007.
    Pol
    muški
    Poruke
    234
    Reputaciona moć
    40

    Podrazumevano Re: HTML Tutorial

    pa nabavis kod od tog widgeta (obicno na sajtovima gde imaju widgeti stoji odmah pored i kod) i samo copy/paste u web sajt u namenjeno mesto, malo doradis sajt, da bi lepse izgledao i gotova stvar...

  16. #16
    Zainteresovan član
    Učlanjen
    03.01.2009.
    Pol
    muški
    Lokacija
    Zaječar, Dedinje
    Poruke
    222
    Reputaciona moć
    35

    Podrazumevano Re: HTML Tutorial

    ovu poruku sto sam pisao cini mi se kao prvi put da je vidim
    ali hvala

  17. #17
    Primećen član Desecration Smile (avatar)
    Učlanjen
    09.06.2006.
    Pol
    ženski
    Lokacija
    Veliki oglan (koji je moločan!)
    Poruke
    1.000
    Tekstova u blogu
    2
    Reputaciona moć
    53

    Podrazumevano Re: HTML Tutorial

    Ovako se radilo 1996. godine.
    Gde si ovo naučio?
    Ko u današnje vreme hard-koduje bilo šta?
    Gde je ovde CSS?

    Čegeburge širom šisve,
    svi bagrepi tiho žvikse,
    kuvno beše...ali zlupki strepi!

  18. #18
    Peruzzi nije na forumu
    је дошао тихо и ушао у легенду...
    Domaćin Peruzzi (avatar)
    Učlanjen
    03.08.2003.
    Pol
    muški
    Lokacija
    Shumadija
    Poruke
    3.924
    Reputaciona moć
    92

    Podrazumevano Re: HTML Tutorial

    ovo je html tutorial za pocetnike.

    ne mozes da ocekujes da pocetnika naucis najnovijoj tehnologiji. uvek se krece od pocetka - zato se u skoli i uci pascal, a ne java, c++ ili neki visi jezik


Slične teme

  1. Html tutorial
    Autor ^Darius^ u forumu Web dizajn
    Odgovora: 3
    Poslednja poruka: 08.04.2009., 15:05
  2. C Tutorial
    Autor mindopener_ u forumu Programiranje
    Odgovora: 1
    Poslednja poruka: 11.12.2007., 13:21
  3. Tutorial za HTML
    Autor RedDragon u forumu Web dizajn
    Odgovora: 5
    Poslednja poruka: 27.01.2005., 13:28
  4. C++ tutorial
    Autor dirg@ u forumu Programiranje
    Odgovora: 36
    Poslednja poruka: 07.07.2004., 22:19

Pravila za slanje poruka

  • Ne možete kreirati novu temu
  • Ne možete poslati odgovor
  • Ne možete dodati priloge
  • Ne možete prepraviti svoju poruku
  •