Odgovori sa citatomCSS je skup pravila formatiranja koji se pridodaju HTML dokumentu. CSS nam omogućuje lakšu i bolju kontrolu nad HTML-om, te ubrzava uređivanje više dokumenata za koje primjenjujemo isto formatiranje.
Pisanje CSS koda nije teško, a danas je najbolje i najprihvaćenije rješenje - mislim da su to dovoljni razlozi da čitate dalje.
CSS se u dokument može integrirati na 3 načina:
- izravno na određeni tag
- na cijeli dokument unutar HEAD tag-a
- na cijeli dokument, likanjem eksterne (vanjske) CSS datoteke
Najprije pogledajte kako uopće CSS izgleda. U slijedećem primjeru prikazano je oblikovanje za BODY tag.
body {
background: blue;
font-family: Arial;
font-size: 12px;
color: #000000;
margin: 0px;
padding: 20px;
}
Prva riječ označava tag na koji se formatiranje odnosi (u ovom slučaju na BODY). Iza nje slijedi otvorena vitičasta zagrada, što znači da sada počinjemo nizati atribute. Atributi su određeni engleskom riječi (ili više njih), koje prilično logično objašnjavaju o kakvom se formatiranju radi. Ako je više riječi, povezane su crticom.
Iza naziva formata slijedi dvotočka, a poslije nje pišemo vrijednost (boja, veličina itd.). Na kraju ide točka-zarez, što znači da je ovaj atribut gotov i prelazimo na slijedeći. Atribute smijemo pisati u istom redu, ali bitno je da ih odvojimo točka-zarezom! Nakon svih navedenih atributa, moramo zatvoriti vitičastu zagradu. To znači da smo završili formatiranje body taga i nakon toga možemo prijeći na slijedeći.
Na ovom primjeru možemo vidjeti kako se definira boja pozadine, font, veličina teksta, boja teksta, margine i pomak od ruba - padding (slično kao margine, ali poslije ćete vidjeti da nije isto).
Već sam navela kako postoje tri načina za pridavanje CSS-a dokumentu. Sada ću to na primjeru detaljnije objasniti.
1. Izravno na tag
Ovaj način se ne preporuča u formatiranju cijelog dokumenta, ali ako imamo samo jedan element na stranici kojeg želimo formatirati, onda može poslužiti.
<body style="background: blue; font-family: Arial; font-size: 12px; color: #000000; margin: 0px; padding: 20px">
2. Unutar HEAD tag-a dokumenta
Unutar HEAD taga obično se pišu informacije o dokumentu i dodaju se skripte i slično. To što napišemo u HEAD-u, vrijedi za cijeli dokument. Ovdje je prikazano kako izgleda HEAD tag dokumenta sa CSS-om
<html>
<head>
<title> naslov stranice </title>
<style type="text/css">
body {
background: blue;
font-family: Arial;
font-size: 12px;
color: #000000;
margin: 0px;
padding: 20px;
}
</style>
</head>
<body>
Sadržaj stranice
</body>
</html>
Ovaj način dati će isti rezultat kao i gore spomenuti. Korisnici bloga u uređivanju svog dizajna najčešće će se služiti ovim načinom.
3. Eksterna datoteka
Ovo je najbolji način, jer se tako može primjenjivati isti format na više datoteka. To se radi na jednostavan način: u Notepadu napišete CSS i spremite pod nazivom ime.css. Uploadate datoteku na server i zatim je linkate u sve dokumente za koje želite da sadrže taj CSS, a to radite pomoću ovog koda:
<link href="http://www.server.com/files/ime.css" rel="stylesheet" type="text/css" />
Ako radite na ovaj način, biti će lako mijenjati dizajn - trebate promijeniti samo ime.css datoteku, uploadati je na server, a sve HTML datoteke će poprimiti novo formatiranje
Pokazujem rezultate 1 do 10 od 35
HTML i CSS
Raspravljate o temi HTML i CSS u Programiranje forumu, dio Računala foruma; Ovo je skraćeni tutorijal HTML-a...vidjela sam da nema takve teme, pa sam ju otvorila. Možda nekom pomogne kao što pomaže ...
-
LinkBack
LinkBack URL
About LinkBacks- Bookmark & Share
- Tweet this thread
- Share on Facebook!
- 27-07-07, 15:20 #1xD
- Datum registracije
- 26-06-06
- Lokacija
- Slavonski Brod
- Starost
- 17
- Poruka
- 6,735
- Liked
- 3 times
HTML i CSS
Ovo je skraćeni tutorijal HTML-a...vidjela sam da nema takve teme, pa sam ju otvorila. Možda nekom pomogne kao što pomaže i meni...
Ovo je obavezno štivo za sve one koji se prvi put susreću s HTML kodom. Ovaj tutorial nije o dizajniranju, već, kao što naslov kaže, uvod
HTML prema Riječniku komunikacijske tehnologije znači hipertekstualni (tekst čitljiv u više dimenzija) označeni jezik. Zanemarimo sad informatička objašnjenja, najjednostavnije bi bilo reći da se radi o običnoj tekstualnoj datoteci, koju Internet browseri "vide" kao malo manje običnu tekstualnu datoteku, tj. interpretiraju kod u tekst, slike i zvuk. Cijela stranica, koliko god multimedijalnih dodataka imala, nije ništa drugo nego tekst. Kliknite desnom tipkom miša i na meniju odaberite View Source - vidjet ćete kako zapravo izgleda ova stranica.
HTML možete pisati u bilo kojem tekst-editoru, počevši od Notepada.
Dakako, Notepad nije najbolje rješenje za početnike. Postoje brojni programi koji vam omogućuju izradu odličnih stranica, bez da napišete ijednu liniju koda, takozvani WYSIWYG programi. Ipak, savjetujem vam da proučavate kod dok ga pišete, jer tako mnogo toga možete upamtiti i znatno ubrzati svoj rad.
Već unutar Microsoft Office-a možete naći program FrontPage. Iako vam ga nijedan ozbiljni web dizajner neće preporučiti, i to je dobro za početak.
Kako izgleda HTML kod?
HTML kod sastoji se od mnoštva tagova. Tag je najmanja jedinica, dio koda. Možete prepoznati tag po tome što se nalazi unutar matematičkih operatora za veće i manje <> .
Na početku svake HTML stranice nalazi se tag <HTML>. On označava početak stranice. Na kraju dokumenta naći ćete </HTML> - on označava kraj stranice. Sve što se nalazi unutar tih dviju oznaka, browser će interpretirati kao HTML stranicu, a ono što se nalazi izvan neće.
Prvi tag unutar stranice je <HEAD>. On sadrži stvari koje određuju stranicu, kao naslov stranice, encoding, meta tagove i slično - taj tekst nećete vidjeti u browseru, ali sve što je ovdje napisano od velike je važnosti za stranicu.
Negdje između <HEAD> i </HEAD> treba smjestiti <TITLE> </TITLE>. Između se upisuje naslov stranice, koji će se prikazati u naslovnoj traci (title bar).
Nakon head taga, slijedi <BODY> </BODY>. Sve što upišete u taj tag bit će vidljivo na stranici. Ovdje ide tekst, slike, tablice, zvuk...
Ovdje je primjer je najjednostavnije HTML stranice. Ako kopirate ovaj kod i pasteate ga u Notepad te stranicu spremite sa završetkom .html umjesto .txt, stranicu možete otvoriti u browseru (npr. Internet Explorer) i vidjeti kako izgleda. Za početak možete vježbati na ovom jednostavnom kodu dodajući mu razne druge sadržaje. Primjetite <br /> tag. On označava prekid retka (linebreak), što znači da tekst iza njega slijedi u drugom retku. Postoje i brojni drugi tagovi koje ovdje nisam spomenula, a trebati će vam u izradi stranice. Ali, njih ćete naučiti u drugim tutorialima.
NAPOMENA: svejedno je pišete li HTML kod velikim ili malim slovima, ali odlučite se za jedno i držite se toga. Ako se odlučite za XHTML poželjno je da pišete tagove malim slovima.
<html>
<head>
<title>Ovo je naslov stranice</title>
</head>
<body>
Ovo je najjednostavnija HTML stranica.<br />Obogatite je onime što naučite
</body>
</html>
- 27-07-07, 15:21 #2xD
- Datum registracije
- 26-06-06
- Lokacija
- Slavonski Brod
- Starost
- 17
- Poruka
- 6,735
- Liked
- 3 times
Re: HTML i CSS
- 09-08-07, 20:39 #3Starter
- Datum registracije
- 08-08-07
- Starost
- 23
- Poruka
- 42
- Liked
- 0 times
- 08-09-07, 15:54 #4Regularni forumas
- Datum registracije
- 05-09-07
- Lokacija
- SK
- Starost
- 22
- Poruka
- 157
- Liked
- 0 times
- 09-09-07, 17:17 #5xD
- Datum registracije
- 26-06-06
- Lokacija
- Slavonski Brod
- Starost
- 17
- Poruka
- 6,735
- Liked
- 3 times
- 10-10-07, 18:09 #6Starter
- Datum registracije
- 02-06-07
- Starost
- 26
- Poruka
- 7
- Liked
- 0 times
- 09-05-08, 15:04 #7Starter
- Datum registracije
- 09-05-08
- Poruka
- 15
- Liked
- 0 times
- 09-05-08, 19:34 #8prof. Foruma
- Datum registracije
- 10-01-08
- Lokacija
- Krapinsko - zagorska županija
- Starost
- 26
- Poruka
- 1,104
- Liked
- 3 times
- 09-05-08, 20:19 #9xD
- Datum registracije
- 26-06-06
- Lokacija
- Slavonski Brod
- Starost
- 17
- Poruka
- 6,735
- Liked
- 3 times
- 22-05-08, 17:12 #10Regularni forumas
- Datum registracije
- 02-07-07
- Starost
- 26
- Poruka
- 451
- Liked
- 0 times
Pravi autor: blackstone 
