Utilizarea gradientului pentru forum
Page 1 of 1
Utilizarea gradientului pentru 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
[You must be registered and logged in to see this link.]
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 :
[You must be registered and logged in to see this link.]
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
[/quote]
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
[You must be registered and logged in to see this link.]
un mic exemplu
exemplu 1 |
exemplu 2 |
acestea sunt codurile culorii gradient folosite mai sus extrase din generator
exemplu1 gradient
- Code:
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
- Code:
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 :
- Code:
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 ); }
- Code:
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 );}
[You must be registered and logged in to see this link.]
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
[/quote]
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum