Ultimele subiecte
» [All Version] Social Link/IconsScris de Jean01Crv 13/10/2014, 12:52 pm
» (pHpBB3) Legenda : Sistem Nou
Scris de Jean01Crv 13/10/2014, 12:49 pm
» Imagine la Statistici & Cine este Conectat ? [pHpBB3]
Scris de Jean01Crv 13/10/2014, 12:44 pm
» Statistici - Sistem Nou [pHpBB3]
Scris de Jean01Crv 13/10/2014, 12:20 pm
» [Prezentare]Chozen
Scris de valyd1971 16/5/2014, 12:54 am
Vizitator
Cine este conectat?
În total sunt 18 utilizatori conectați: 0 Înregistrați, 0 Invizibil și 18 Vizitatori Nici unul
Recordul de utilizatori conectați a fost de 42, 1/11/2012, 8:58 am
Utilizarea Gradientului pe forum
2 participanți
Pagina 1 din 1
Utilizarea Gradientului pe forum
Salut de carand am invatat sa folosesc gradient.multi nu stiu ce este asa ca am sa va spun chiar eu pe scurt.
Gradientul este un fundal colorat care poate fi folosit ca o imagine
Intrati aici si personalizati-va colorile preferate,ele vor inlocui imaginile care ingreuneaza forumul
Generator Gradient online
un mic exemplu
acestea sunt codurile culorii gradient folosite mai sus extrase din generator
exemplu1 gradient
exemplu 2 gradient
se poate folosi foarte usor sa mai dau asa un mic exemplu:
la categoriile forumului phpbb3 stiti clasa este li.row
sa pregatesc acum codul :
Previzualizare live
Vedeti? este foarte simplu mai ales ca este pentru toate versiunile de browser folosite
tot ceea ce am facut in plus este ca am adaugat border dupa preferintele care le-am vrut
Gradientul este un fundal colorat care poate fi folosit ca o imagine
Intrati aici si personalizati-va colorile preferate,ele vor inlocui imaginile care ingreuneaza forumul
Generator Gradient online
un mic exemplu
exemplu 1 |
exemplu 2 |
acestea sunt codurile culorii gradient folosite mai sus extrase din generator
exemplu1 gradient
- Cod:
BORDER: 1px solid #E7E7E7;padding: 5px;background: rgb(255,255,255); /* Old browsers */background: -moz-linear-gradient(top, rgb(255,255,255) 0%, rgb(229,229,229) 100%); /* FF3.6+ */background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(255,255,255)), color-stop(100%,rgb(229,229,229))); /* Chrome,Safari4+ */background: -webkit-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* Chrome10+,Safari5.1+ */background: -o-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* Opera 11.10+ */background: -ms-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* IE10+ */background: linear-gradient(to bottom, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* W3C */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
exemplu 2 gradient
- Cod:
BORDER: 1px solid #E7E7E7;padding: 5px;background: rgb(229,229,229); /* Old browsers */background: -moz-linear-gradient(top, rgb(229,229,229) 0%, rgb(255,255,255) 100%); /* FF3.6+ */background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(229,229,229)), color-stop(100%,rgb(255,255,255))); /* Chrome,Safari4+ */background: -webkit-linear-gradient(top, rgb(229,229,229) 0%,rgb(255,255,255) 100%); /* Chrome10+,Safari5.1+ */background: -o-linear-gradient(top, rgb(229,229,229) 0%,rgb(255,255,255) 100%); /* Opera 11.10+ */background: -ms-linear-gradient(top, rgb(229,229,229) 0%,rgb(255,255,255) 100%); /* IE10+ */background: linear-gradient(to bottom, rgb(229,229,229) 0%,rgb(255,255,255) 100%); /* W3C */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5e5e5', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */"
se poate folosi foarte usor sa mai dau asa un mic exemplu:
la categoriile forumului phpbb3 stiti clasa este li.row
sa pregatesc acum codul :
- Cod:
li.row{
border-top: 1px solid #c4c4c4;
border-left: 1px solid #c4c4c4;
border-right: 1px solid #c4c4c4;
border-bottom: 1px solid white;
background: rgb(255,255,255); /* Old browsers */background: -moz-linear-gradient(top, rgb(255,255,255) 0%, rgb(229,229,229) 100%); /* FF3.6+ */background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(255,255,255)), color-stop(100%,rgb(229,229,229))); /* Chrome,Safari4+ */background: -webkit-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* Chrome10+,Safari5.1+ */background: -o-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* Opera 11.10+ */background: -ms-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* IE10+ */background: linear-gradient(to bottom, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* W3C */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); }
- Cod:
li.row:hover{
border-top: 1px solid #c4c4c4;
border-left: 1px solid #c4c4c4;
border-right: 1px solid #c4c4c4;
border-bottom: 1px solid white;
background: rgb(229,229,229); /* Old browsers */background: -moz-linear-gradient(top, rgb(229,229,229) 0%, rgb(255,255,255) 100%); /* FF3.6+ */background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(229,229,229)), color-stop(100%,rgb(255,255,255))); /* Chrome,Safari4+ */background: -webkit-linear-gradient(top, rgb(229,229,229) 0%,rgb(255,255,255) 100%); /* Chrome10+,Safari5.1+ */background: -o-linear-gradient(top, rgb(229,229,229) 0%,rgb(255,255,255) 100%); /* Opera 11.10+ */background: -ms-linear-gradient(top, rgb(229,229,229) 0%,rgb(255,255,255) 100%); /* IE10+ */background: linear-gradient(to bottom, rgb(229,229,229) 0%,rgb(255,255,255) 100%); /* W3C */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5e5e5', endColorstr='#ffffff',GradientType=0 );}
Previzualizare live
Vedeti? este foarte simplu mai ales ca este pentru toate versiunile de browser folosite
tot ceea ce am facut in plus este ca am adaugat border dupa preferintele care le-am vrut
mr.franta- Client
Pagina 1 din 1
Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum
|
|