#1 HTML Beginner
Posted: 19/08/2018 10:05
Evo da pokusamo nekako od pocetka od nekog uvoda
Većina stvari na webu se ne razlikuje od stvari na vašem računaru - to je samo čitav teret datoteka sortiran u čitavom opsegu direktorija.
HTML datoteke nisu ništa više od jednostavnih tekstualnih datoteka, tako da počnete pisati u HTML-u, ne trebate ništa više od jednostavnog tekst urednika.
Notepad je uobičajeni editor teksta na računarima zasnovanim na operativnom sistemu Windows (obično se nalazi u meniju Programs (Programi)> Accessories (Dodatna oprema)), a Mac OSX računari se isporučuju sa tekstualnim programom TextEdit, ali svaki program koji vam dozvoljava da izvedete sa tekstom.
Ja licno koristim Sublime Text, ali mozete koristiti gore navedeno.
Ukucajte ovo u svoj tekst editor:
Sada kreirajte fasciklu pod nazivom "html" gdje god želite da sačuvate datoteke na računaru i sačuvate datoteku kao "mojaprvastranica.html".
Budite pazljivi. Važno je da je dodatak ".html" naveden - neki tekstualni urednici, kao što je Notepad, će u drugom slučaju automatski sačuvati kao ".txt".
Takođe morate osigurati da se vaša datoteka čuva kao običan tekst. TextEdit će, na primjer, pokrenuti nove datoteke kao "Rich text", koji sadrže puno ekstrakcija za formatiranje, po podrazumevanom podešavanju. U takvim slučajevima idite u željene postavke i proverite da li je pre nego što ste napravili novu datoteku proverili opciju "Običan tekst".
Za pretraživanje HTML datoteka, čak ni ne moraju biti na webu. Otvorite web pretraživač, kao što su Chrome, Firefox, Safari ili (Ne daj Boze) Internet Explorer, a u browser, gdje obično upišete web adrese, unesite lokaciju datoteke koju ste upravo snimili (na primjer, "c: \ html \ mojaprvastranica.html ") enter. Kao alternativu, idite u meni File u browseru, odaberite Open i pretražite file. Ili desni klik na file i opet with...
Wow. Tamo je. Vaša prva web stranica. A sve što je potrebno bilo je nekoliko tipkanih reči.
Ovde smo rekli da koristite osnovni tekst editor, kao što je Notepad, ali možda ćete biti u iskušenju da koristite namenski softver kao što je Adobe Dreamweaver.
Trebalo bi da budete veoma pažljivi kada koristite ove programe, pogotovo ako ste početnik, jer često bacaju nepotrebni ili nestandardni kod kako bi vam "pomogao".
Ako ste ozbiljni u vezi sa učenjem HTML-a, trebalo bi da pratite ovu temu , tako da barem imate osnovno razumevanje onoga što se dešava.
Softverski programi nikada neće vam dati istu kontrolu nad web stranicom kao kodiranje ručno.
<!-- Tags, Attributes, and Elements -->
Iako su osnove HTML-a običan tekst, potrebno je malo više da bismo postali lijepi i sjajni HTML dokument.
<!-- Tags -->
Osnovna struktura HTML dokumenta uključuje oznake, koje okružuju sadržaj i primjenjuju značenje za njega.
Promenite svoj dokument tako da izgleda ovako:
Sada sačuvajte dokument ponovo, vratite se na web browser i ponovo učitajte stranicu.
Pojava stranice se uopšte neće promeniti, ali svrha HTML-a je da primeni značenje, a ne prezentaciju, a ovaj primjer je sada definirao neke osnovne elemente web stranice.
Prva linija na vrhu, <! DOCTYPE html>, je deklaracija tipa dokumenta i omogućava pregledaču da zna koji HTML-a koristite (HTML5, u ovom slučaju). Veoma je važno držati ovo - ako ne, pretraživači će pretpostaviti da ne znate šta radite i da postupite na vrlo poseban način.
Da se vratimo na tačku, <html> je otvaranje oznaka koja otvara stvari i govori pregledaču da je sve između tog i zatvaranja tag </ html> HTML dokument. Stvari između <body> i </ body> su glavni sadržaj dokumenta koji će se pojaviti u prozoru pregledača.
<!-- Closing tags -->
</ Body> i </ html> približavaju svoje elemente (više o elementima malo kasnije).
Nisu svi tagovi opremljeni sa oznakama za zatvaranje (<html> </ html>) neke oznake, koje se ne zatvaraju oko sadržaja, zatvaraju se. Oznaka linije za razbijanje, na primer, izgleda ovako: <br> - prelom linije ne sadrži nikakav sadržaj, tako da oznaka sretno sjedi zbog svog usamljenog selfa. Naći ćemo te primere kasnije. Sve što treba da zapamtite je da sve oznake sa sadržajem između njih treba zatvoriti, u formatu otvaranja oznake → sadržaja → zatvaranje oznake. Nije strogo rečeno, uvijek je uslov, ali to je konvencija koju koristimo u ovim tutorijalima jer je dobra praksa koja rezultira čistijim i lakšim razumevanjem koda.
Možda ćete naleteti na "self-closing" oznaka, pri čemu će br tag, na primer, izgledati kao "<br />" umjesto jednostavno "<br>". Ovo je ostatak XHTML-a, oblika HTML-a zasnovanog na drugom jeziku markiranja koji se zove XML. HTML5 je mnogo hladniji od XHTML-a i biće zadovoljan sa bilo kojim formatom. Neki programeri preferiraju jedan način, neki preferiraju drugu. Bacili smo novčić i odlučili se držati jednostavnije verzije.
<!-- Attributes -->
Oznake mogu imati atribute, koji su dodatni detalji informacija. Atributi se pojavljuju unutar otvaranja oznake i njihove vrijednosti se nalaze unutar znakova navoda. Izgledaju nešto poput <tag attribute = "value"> Margarine </ tag>.
<!-- Elements -->
Oznake ne čine mnogo više od obeležavanja početka i kraja elementa. Elementi su bitovi koji čine web stranice. Rekao bi, na primjer, da je sve što je između (i uključuje) oznake <body> i </ body> element tela. Kao još jedan primer, dok su "<title>" i "</ title>" oznake, "<title> Naslov </ title>" je naslovni element.
Nadam se da ce neko ovo procitati
Nastavit cu ako bude zainteresovanih
Većina stvari na webu se ne razlikuje od stvari na vašem računaru - to je samo čitav teret datoteka sortiran u čitavom opsegu direktorija.
HTML datoteke nisu ništa više od jednostavnih tekstualnih datoteka, tako da počnete pisati u HTML-u, ne trebate ništa više od jednostavnog tekst urednika.
Notepad je uobičajeni editor teksta na računarima zasnovanim na operativnom sistemu Windows (obično se nalazi u meniju Programs (Programi)> Accessories (Dodatna oprema)), a Mac OSX računari se isporučuju sa tekstualnim programom TextEdit, ali svaki program koji vam dozvoljava da izvedete sa tekstom.
Ja licno koristim Sublime Text, ali mozete koristiti gore navedeno.
Ukucajte ovo u svoj tekst editor:
Code: Select all
Ovo je moja prva web stranica
Budite pazljivi. Važno je da je dodatak ".html" naveden - neki tekstualni urednici, kao što je Notepad, će u drugom slučaju automatski sačuvati kao ".txt".
Takođe morate osigurati da se vaša datoteka čuva kao običan tekst. TextEdit će, na primjer, pokrenuti nove datoteke kao "Rich text", koji sadrže puno ekstrakcija za formatiranje, po podrazumevanom podešavanju. U takvim slučajevima idite u željene postavke i proverite da li je pre nego što ste napravili novu datoteku proverili opciju "Običan tekst".
Za pretraživanje HTML datoteka, čak ni ne moraju biti na webu. Otvorite web pretraživač, kao što su Chrome, Firefox, Safari ili (Ne daj Boze) Internet Explorer, a u browser, gdje obično upišete web adrese, unesite lokaciju datoteke koju ste upravo snimili (na primjer, "c: \ html \ mojaprvastranica.html ") enter. Kao alternativu, idite u meni File u browseru, odaberite Open i pretražite file. Ili desni klik na file i opet with...
Wow. Tamo je. Vaša prva web stranica. A sve što je potrebno bilo je nekoliko tipkanih reči.
Ovde smo rekli da koristite osnovni tekst editor, kao što je Notepad, ali možda ćete biti u iskušenju da koristite namenski softver kao što je Adobe Dreamweaver.
Trebalo bi da budete veoma pažljivi kada koristite ove programe, pogotovo ako ste početnik, jer često bacaju nepotrebni ili nestandardni kod kako bi vam "pomogao".
Ako ste ozbiljni u vezi sa učenjem HTML-a, trebalo bi da pratite ovu temu , tako da barem imate osnovno razumevanje onoga što se dešava.
Softverski programi nikada neće vam dati istu kontrolu nad web stranicom kao kodiranje ručno.
<!-- Tags, Attributes, and Elements -->
Iako su osnove HTML-a običan tekst, potrebno je malo više da bismo postali lijepi i sjajni HTML dokument.
<!-- Tags -->
Osnovna struktura HTML dokumenta uključuje oznake, koje okružuju sadržaj i primjenjuju značenje za njega.
Promenite svoj dokument tako da izgleda ovako:
Code: Select all
<!DOCTYPE html>
<html>
<body>
Ovo je moja prva stranica
</body>
</html>
Pojava stranice se uopšte neće promeniti, ali svrha HTML-a je da primeni značenje, a ne prezentaciju, a ovaj primjer je sada definirao neke osnovne elemente web stranice.
Prva linija na vrhu, <! DOCTYPE html>, je deklaracija tipa dokumenta i omogućava pregledaču da zna koji HTML-a koristite (HTML5, u ovom slučaju). Veoma je važno držati ovo - ako ne, pretraživači će pretpostaviti da ne znate šta radite i da postupite na vrlo poseban način.
Da se vratimo na tačku, <html> je otvaranje oznaka koja otvara stvari i govori pregledaču da je sve između tog i zatvaranja tag </ html> HTML dokument. Stvari između <body> i </ body> su glavni sadržaj dokumenta koji će se pojaviti u prozoru pregledača.
<!-- Closing tags -->
</ Body> i </ html> približavaju svoje elemente (više o elementima malo kasnije).
Nisu svi tagovi opremljeni sa oznakama za zatvaranje (<html> </ html>) neke oznake, koje se ne zatvaraju oko sadržaja, zatvaraju se. Oznaka linije za razbijanje, na primer, izgleda ovako: <br> - prelom linije ne sadrži nikakav sadržaj, tako da oznaka sretno sjedi zbog svog usamljenog selfa. Naći ćemo te primere kasnije. Sve što treba da zapamtite je da sve oznake sa sadržajem između njih treba zatvoriti, u formatu otvaranja oznake → sadržaja → zatvaranje oznake. Nije strogo rečeno, uvijek je uslov, ali to je konvencija koju koristimo u ovim tutorijalima jer je dobra praksa koja rezultira čistijim i lakšim razumevanjem koda.
Možda ćete naleteti na "self-closing" oznaka, pri čemu će br tag, na primer, izgledati kao "<br />" umjesto jednostavno "<br>". Ovo je ostatak XHTML-a, oblika HTML-a zasnovanog na drugom jeziku markiranja koji se zove XML. HTML5 je mnogo hladniji od XHTML-a i biće zadovoljan sa bilo kojim formatom. Neki programeri preferiraju jedan način, neki preferiraju drugu. Bacili smo novčić i odlučili se držati jednostavnije verzije.
<!-- Attributes -->
Oznake mogu imati atribute, koji su dodatni detalji informacija. Atributi se pojavljuju unutar otvaranja oznake i njihove vrijednosti se nalaze unutar znakova navoda. Izgledaju nešto poput <tag attribute = "value"> Margarine </ tag>.
<!-- Elements -->
Oznake ne čine mnogo više od obeležavanja početka i kraja elementa. Elementi su bitovi koji čine web stranice. Rekao bi, na primjer, da je sve što je između (i uključuje) oznake <body> i </ body> element tela. Kao još jedan primer, dok su "<title>" i "</ title>" oznake, "<title> Naslov </ title>" je naslovni element.
Nadam se da ce neko ovo procitati
Nastavit cu ako bude zainteresovanih