IZBORNIK HOME FORUM ACCESS EXCEL WORD KAZALO

HOME

   
1 Uvod
2 Pokretanje Front Page 2003
3 Izgled radnog prozora
4 Tekstualni izbornici
5 Alatne trake
6 Pripreme za izradu
7 Kreiranje prve stranice
8 Umetanje tablica i raspored
9 Oblikovanje tablica i stranice
10 Umetanje logotipa i slika
11 Umetanje linkova
12 Umetanje INLINE-frame
13 Umetanje Bookmarka
14 Kreiranje stranice bez Inline Frame
15 Kreiranje pomoću čarobnjaka
16 Upload na server
17 Iskoristite Photoshop
18 Što je CSS ?
19 Video prezentacija izrade web stranice
20 Kružni rotator bannera
   
 



MICROSOFT Front Page 2003 - CSS STYLES

18. Što je CSS styles?






Uvod u HTML i CSS styles

HTML - HyperText Markup Language, CSS - Cascading Style Sheets.

Ovaj tutorijal je napisan za početnike koji se po prvi puta susreću sa nazivima HTML i CSS. Opisat ću HTML i CSS značenje te nekoliko kratkih primjera.

Uvod u HTML

HTML je kratica za HyperText Markup Language što znači prezentacijski jezik za izradu web stranica. HTML služi za definiranje izgleda dokumenta, poravnanje i veličine teksta, boja teksta, boja pozadine i još mnogo toga. Ukratko, HTML čini strukturu svake web stranice. HTML kod se sastoji od tagova, a tag je najmanja jedinica, to je dio koda. Tagovi se pišu unutar oznaka "<" i ">". Većina tagova ima početni i završni tag. Evo jedan opširniji primjer:

<html>

<head>
<title>Uvod u HTML i CSS</title>
</head>
<body>
Ovo je tijelo <b>HTML</b> dokumenta.<br />
Ovo je novi redak.
</body>
</html>


<html>
tag označava početak HTML dokumenta i on govori našem internet pregledniku da je počeo učitavati HTML dokument. <head> je zaglavlje HTML dokumenta u kojem se nalazi <title> tag. Unutar <title> taga se inače nalazi ime web stranice ili bloga te neki kratki opis koji se prikazuje u naslovnoj liniji vašeg internet preglednika. <body> je tijelo dokumenta i unutar njega stavljamo sadržaj naše web stranice. <b> tag služi za podebljavanje teksta a <br /> za novi redak.

HTML tagove možete pisati velikim ili malim slovima npr. <body> i <BODY>, ali ja bih preporučio da pišete malim slovima.

HTML kod možete pisati u bilo kojem tekstualnom editoru kao što je Notepad na Windows platformi. Kada napišete kod u nekom tekstualnom editoru, dokument spremite sa nastavkom .html ili .htm te taj dokument možete otvoriti sa vašim internet preglednikom. Ručno pisanje koda nije baš najbolje za početnike no po meni je to najbolji način učenja jer tako ćete naučiti osnove i shvatiti srž HTML-a te ćete znati šta se događa "ispod haube".

Nakon što naučite osnove HTML-a možete se pozabaviti nekim WYSIWYG editorima. WYSIWYG je skraćeni od What You See Is What You Get. Ima raznih WYSIWYG editora, jedan od njih je i Microsoft FrontPage. Iako ga neće preporučiti niti jedan ozbiljniji web dizajner, dobar je za neki početak. Ako želite nešto ozbiljnije tu je najbolji i najčešće korišteni WYSIWYG editor - Macromedia Dreamweaver koji je jednostavan i za početnike.

Uvod u CSS styles

CSS je kratica za Cascading Style Sheets. CSS služi za uređivanje izgleda HTML elemenata. Sa CSS-om možete poboljšati izgled i funkcionalnost web stranice i bloga i može Vam uštedjeti puno vremena. Evo jednog konkretnog primjera:

body {

color: #FFFFFF;
background-color: #000000;
font-family: Verdana;
font-size: 13px;
font-weight: bold;
}

 
body
je prva riječ koja označava tag koji se formatira. Iza slijedi vitičasta zagrada iza koje počinjemo sa atributima. Atributi su engleske riječi koje logično objašnjavaju o kakvom se formatiranju radi. Iza atributa dolazi dvotočka, a poslije nje pišemo vrijednost (boja, veličina). Na kraju dolazi točka zarez što znači da smo gotovi sa ovim atributom i prelazimo na slijedeći. Atribut color služi za promjenu boje teksta, background-color za promjenu boje pozadine, font-family za promjenu fonta (Verdana, Arial, Times New Roman), font-size je veličina font (u pixelima) a font-weight označava debljinu slova (normal, bold, bolder, lighter).

Ima tri načina da se CSS kod integrira sa HTML kodom:

1. Izravno na HTML tag
Ovaj način se ne preporuča u formatiranju cijelog HTML dokumenta nego možda za samo jedan element i kada je to baš potrebno.
<body style="color: #FFFFFF; background-color: #000000; font-family: Verdana; font-size: 13px; font-weight: bold;">

2. Unutar zaglavlja dokumenta
CSS kod ubacimo unutar <head> taga na slijedeći način:


<head>

<style type="text/css">
body {
color: #FFFFFF;
background-color: #000000;
font-family: Verdana;
font-size: 13px;
font-weight: bold;
}
</style>
</head>

3. Eksterna datoteka

Ovo je vjerovatno najbolja varijanta i najpreglednije izvedeno. Uđete u neki tekstualni editor, napišete CSS kod, spremite dokument sa nastavkom .css te ga uploadate na neki server kao što je BlogSpremnik.com. Za spajanje tog dokumenta sa ostatkom HTML koda koristite slijedeći kod:

<link href="http://www.stranica.com/stil.css" rel="stylesheet" type="text/css" />

Ovo bi bio nekakav uvod u HTML i CSS, najosnovnije stvari. U daljnjim tutorijalima ću se pozabaviti konkretnijim stvarima kao što je dodavanje slika i video isječaka na blog, mjenjanje nekih CSS stilova...

Prenešeno sa http://www.blogeri.hr/blog-tutorijali/

Za više kliknite na ovu sliku  





Ova web stranica koristi COOKIES - COPYRIGHT 2008 - 2021 - IvanC - ic.ims.hr