Postovi

Prikazuju se postovi od veljača, 2016

HTML - Linkovi (Poveznice)

Najvažniji dio svake web stranicu su linkovi, odnosno poveznice. Oni služe za navigaciju kroz web stranicu, navigaciju na druge web stranice, slike i ostalo. Napravit link je vrlo jednostavno. Za to nam služi <a> tag. Unutar <a> taga upisujemo sadržaj koji će služiti kao poveznica, a za odabir lokacije na koju će link upućivati koristimo atribut href . Ako želimo napraviti link koji upućuje na ovaj blog onda će link izgledati ovako: <a href="http://nauciweb.blogspot.hr/">Nauči Web!</a>   Link će ispasti ovako: Nauči Web!

HTML - Line break (Novi red)

Slika
Možda se pitaš sada što će ti line break? HTML sam po sebi stavlja tekst u novi red kada tekst ne stane u jedan red. No što ako baš moraš napraviti novi red? Ako to napraviš u tekst editoru, tekst će ti staviti u novi red, ali na web stranici će ostati kako je i bilo. Zato se koristi <br> tag. Tag <br> se koristi na mjestu gdje želimo napraviti novi red. Primjer za novi red: <p>Mogu i znam<br>napraviti novi<br>red<br>na web<br>stranici!</p> To ispadne kao na slici ispod. Cijeli kod: <!DOCTYPE html> <html lang="hr">     <head>         <meta charset="utf-8"/>         <title>Novi red</title>     </head>     <body>         <p>Mogu i znam<br>napraviti novi<br>red<br>na web<br>stranici!</p>     </body> </html>

HTML - Paragraph (Paragrafi)

Slika
Paragrafi su tagovi u koje se stavlja neki tekst. Paragraf se piše kao tag <p> . U njega se može stavljati cijeli odlomak, rečenica ili riječ. Stavlja se unutar <body> taga, a sadržaj paragrafa se stavlja unutar <p></p> taga. Jednostavan primjer je: <p>Ovo je jednostavan paragraf!</p> Ako je sve dobro napravljeno, trebaš dobiti stranicu isto kao i na slici. Cijeli kod: <!DOCTYPE html> <html lang="hr">     <head>         <meta charset="utf-8"/>         <title>Paragrafi</title>     </head>     <body>         <p>Ovo je jednostavan paragraf!</p>     </body> </html>

HTML - Headeri (Zaglavlja)

Slika
Headeri su kao što i samo ime kaže, zaglavlja koja se koriste da bi istakla neki određeni tekst ili neko poglavlje, post ili nešto slično. U HTML-u imamo šest različitih headera. Oni se pišu ovako: <h1> , <h2> , <h3> , <h4> , <h5> i <h6> . Kada želiš koristiti header odnosno zaglavlje, jednostavno napišeš <h1>Tekst nekog zaglavlja</h1> . Na slici ispod, napravio sam u jednostavnom dokumentu sva šest zaglavlja, pa ih možeš proučiti i vidjeti razliku između njih. Cijeli HTML kod je: <!DOCTYPE html> <html lang="hr">     <head>         <meta charset="utf-8"/>         <title>Zaglavlja</title>     </head>     <body>         <h1>Zaglavlje 1</h1>         <h2>Zaglavlje 2</h2>         <h3>Zaglavlje 3</h3>         <h4>Zaglavlje 4</h4>         <h5>Zaglavlje 5</h5>         <h6>Zaglavlje 6</h6>     </bo

HTML - Title (Naslov)

Slika
U prijašnjem postu dao sam idući kod: <!DOCTYPE html> <html lang="hr">     <head>         <meta charset="utf-8"/>     </head>  <body>  </body> </html> Kopiraj taj kod i zaljepi ga u text editor. Nakon toga spremi dokument kao nekoime.html gdje god ti želiš. Napomena: dokument mora imati nastavak .html inače neće raditi. Sada u mapi gdje je spremljena stranica, dva puta brzo klikni ili desni klik i odaberi otvori sa nekim web preglednikom. Kada to napraviš otvorit će ti se web preglednik i stranica će izgledati kao na slici ispod. Sada ćemo prvu promjenu na stranici, koja nije nešto pretjerano vidljiva, ali služi za bolje snalaželje u pretraživaču. U <head> tagu ispod <meta> taga stavi još i ovaj kod: <title>Moja prva web stranica</title> Sada <head> tag mora izgledati ovako: <head>         <meta charset="utf-8"/>         <title>

HTML - Tagovi i atributi

Slika
Pogledaj kod ispod ovog teksta. <!DOCTYPE html> <html lang="hr">   <head> <meta charset="utf-8"/> </head> <body> </body> </html> Sigurno se pitaš što je sada ovo. To je osnovni kod za HTML. To je dio koda koji ćeš morati imati u svakom dokumentu. Tagovi Sve što je u šiljastim zagradama je zapravo  tag (<html>, <head>, <body>, <meta>, itd.) . Uzmimo na primjer html  tag . On izgleda ovako:  <html> Neki kod između... </html>  Kada se radi novi tag mi ga radimo da nešto stavimo u njega. Zato  <html> služi za otvaranje, a   </html> za zatvaranje html taga. Zašto se onda meta tag ne zatvara? Meta tag se zapravo zatvara, ali na drukčiji način. Pošto ne stavljamo ništa unutar taga , bilo bi glupo da tag onda izgleda ovako: <meta charset="utf-8"></meta> Radi jednostavnosti se onda piše: <meta chars

Početak

Slika
Ovo je uvodni post gdje ću pokušati objasniti što je to HTML i zašto on služi te što je potrebo imati da bi ga se počelo kodirati. Kratko o HTML-u i CSS-u Znam da većina ljudi ne voli dugačke uvode pa ću napisati jasno i kratko.  HTML je jezik (nije programski) koji služi za stvaranje sadržaja i strukturiranje njega. HTML se sam po sebi ne može stilirati, odnosno, ne može sam mjenjati boju pozadine, veličinu fonta i slično. Zato nam dolazi još jedan jezik (isto nije programski) koji zove CSS . CSS jednostavno pretvara ružan HTML dokument u lijepi HTML dokument, odnosno lijepu web stranicu. Alat potreban za početak (programi) Od alata ti nije potreno ništa što već nemaš na računalu! Ako imaš web preglednik (Firefox, Chrome, Opera, Safari, itd.) i imaš nekakav text editor (Notepad, Wordpad, Notepad++, Gedit ili nešto drugo što nije Word, Libre Office Writer ili nešto slično tome jer to nije text editor nego je text processor . Za početak preporučujem Notepad++ , jer je j