Na The5k.org, poznatome siteu cija je ideja dokazati da se originalan web site moze napraviti sa svega 5kb koda i grafike, je upravo otvoren novi 5K 2002 natjecaj. Ako imate ambicije dokazati se u tako necemu - prijavite se, svi su pozvani.

Najtrazeniji CSS trikovi
Napisao: Igor Sjeverac © 2001 - 2002

Posjetitelji nas cesto kontaktiraju zbog problema koji se jednostavno mogu rijesiti pomocu trikova iz ovog clanka. Saznajte kako promijeniti boju scrollbara, napraviti sjenu i postaviti pozadinu. Tu je i tablica zamjenskih HTML kôdova za hrvatska slova.

Promjena boje scrollbara

Evo kako promijeniti boju vaseg scrollbara i uskladiti ga s ostatkom vase stranice. Jednostavno ubacite ovaj kôd u HEAD vaseg HTML kôda i promjenom parametara izaberite zeljenu boju.

<STYLE>

BODY {

 SCROLLBAR-FACE-COLOR: #336699; 
 SCROLLBAR-HIGHLIGHT-COLOR: #95c5f4; 
 SCROLLBAR-SHADOW-COLOR: #000000; 
 SCROLLBAR-3DLIGHT-COLOR: #336699; 
 SCROLLBAR-ARROW-COLOR: #ffffff; 
 SCROLLBAR-TRACK-COLOR: #639cce; 
 SCROLLBAR-DARKSHADOW-COLOR: black

}

</STYLE>

Sjena pomocu CSS-a

Evo kako postici da HTML elementi na stranici bacaju sjenu. Primjer radi sa IE4+ i NS4+.

<!-- Unesite ovaj kod unutar HEAD tagova -->
<style>
 #text 
 {
 font-family:verdana; 
 position: absolute; 
 top: 5px; 
 left: 5px; 
 color:#000000; 
 z-index:1;
 }
 #shadow1 
 {
 font-family:verdana;
 position: absolute;
 top: 8px;
 left: 8px;
 color: #666666;
 z-index:0;
 } 
</style>
 		 
<!-- Unesite ovaj kod unutar BODY tagova -->
<SPAN ID="shadow1">
<H1>Webmajstori.net</H1></SPAN>
<SPAN ID="text">
<H1>Webmajstori.net</H1></SPAN> 

Koristite nasa slova na web stranici

Ubacivanje nasih slova je vrlo jednostavno:

1. U HTML kôdu svake stranice unutar HEAD tagova ubacite META tag:

<meta http-equiv="Content-Type" 
 content="text/html; charset=windows-1250">

2. U HTML kôdu na mjestu gdje treba stajati neko nase slovo ubacite sljedece ASCII kôdove tj. simbole:

Pozadinska slika pomocu CSS-a

Pomocu CSS-a mozete svakom elementu (paragraf, naslov, tabela...) postaviti pozadinsku sliku. U te tagove potrebno je postaviti sljedeci atribut:

<style="background-image:url('../slike/poz.gif')">

Ovo vrijedi za Internet Explorer 4+ i Netscape Navigator 4+.

O autoru:

Igor Sjeverac (isjevera@vip.hr) - je tehnicar za elektroniku, pravnik, rock zvijezda (u usponu) i jos puno toga. Bavi se web designom, flash-om, photoshop-om, programiranjem i svim sto ima veze sa racunalima i internetom. Trenutno radi na nekoliko flash animacija i igrica te na svojoj web stranici koju mozete naci na http://fun-factory.averi.hr.