Design 4 U // Dizajn forum - Veb i grafički dizajn
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Sjenke na okvirima !

Ići dole

Sjenke na okvirima ! Empty Sjenke na okvirima !

Počalji od Prince. Uto Feb 15, 2011 9:05 am

Evo jednog zanimljivog efekta kog možete svuda primenjivati, i u HTML stranicama, i na forumima, i svuda. Jedino što vam je potrebno jeste uređivanje CSS-a. Pokazaću vam kako da napravite ovo:

[You must be registered and logged in to see this image.]

Zavisi šta od ponuđenih senki želite da napravite, ali sa slovima A B C D E i F označeno je kakve senke možete imati. Tako da, svaki od pravougaonika označiću slovom.

Kod:
#Primer_A {
-moz-box-shadow: -5px -5px #888;
-webkit-box-shadow: -5px -5px #888;
box-shadow: -5px -5px #888;
}

#Primer_B {
-moz-box-shadow: -5px -5px 5px #888;
-webkit-box-shadow: -5px -5px 5px #888;
box-shadow: -5px -5px 5px #888;
}

#Primer_C {
-moz-box-shadow: -5px -5px 0 5px #888;
-webkit-box-shadow: -5px -5px 0 5px#888;
box-shadow: -5px -5px 0 5px #888;
}

#Primer_D {
-moz-box-shadow: -5px -5px 5px 5px #888;
-webkit-box-shadow: -5px -5px 5px 5px#888;
box-shadow: -5px -5px 5px 5px #888;
}

#Primer_E {
-moz-box-shadow: 0 0 5px #888;
-webkit-box-shadow: 0 0 5px#888;
box-shadow: 0 0 5px #888;
}

#Primer_F {
-moz-box-shadow: 0 0 5px 5px #888;
-webkit-box-shadow: 0 0 5px 5px#888;
box-shadow: 0 0 5px 5px #888;
}

Dakle, taj središnji deo između zagrada {} ubacite u deo CSS-a tj u klčasu kojoj želite dodati senku. DObro obratite pažnju gde dodajete ovaj deo, jer ispadne ružno ako stavite na pogrešno mesto. Naravno možete da menjate veličinu senke (menjajući 5px na više/manje), i boju (umesto #888 stavite boju koja vama odgovara).

A ako želite ovo :

[You must be registered and logged in to see this image.]

Isto važi kao i za drop shadow, dakle središnji deo ubacite negde u CSS a boju menjajte preko #888 a veličinu menjajući broj 5px. Uzmite kod senke označen slovom koje želite.



Kod:
#Primer_H {
-moz-box-shadow: inset -5px -5px #888;
-webkit-box-shadow: inset -5px -5px #888;
box-shadow: inset -5px -5px #888;
}

#Primer_H {
-moz-box-shadow: inset -5px -5px 5px #888;
-webkit-box-shadow: inset -5px -5px 5px #888;
box-shadow: inset -5px -5px 5px #888;
}

#Primer_I {
-moz-box-shadow: inset -5px -5px 0 5px #888;
-webkit-box-shadow: inset -5px -5px 0 5px#888;
box-shadow: inset -5px -5px 0 5px #888;
}

#Primer_J {
-moz-box-shadow: inset -5px -5px 5px 5px #888;
-webkit-box-shadow: inset -5px -5px 5px 5px#888;
box-shadow: inset -5px -5px 5px 5px #888;
}

#Primer_K {
-moz-box-shadow: inset 0 0 5px #888;
-webkit-box-shadow: inset 0 0 5px#888;
box-shadow: inner 0 0 5px #888;
}

#Primer_L {
-moz-box-shadow: inset 0 0 5px 5px #888;
-webkit-box-shadow: inset 0 0 5px 5px#888;
box-shadow: inset 0 0 5px 5px #888;
}

Preuzeto sa Admin Centra - By ten98 !
Prince.
Prince.
Dizajner
Dizajner

Broj poruka Broj poruka : 1901
D4U Novac D4U Novac : 2116
Reputacija Reputacija : 3
Godina Godina : 27
Lokacija Lokacija : Stol'ca :P
Poso/dokolice Poso/dokolice : Umjetnost :)
Sjenke na okvirima ! War1

http://we-are-teens.com/

Nazad na vrh Ići dole

Nazad na vrh


 
Dozvole ovog foruma:
Ne možete odgovarati na teme u ovom forumu