css - Build colour gradation into html -
this top row (banner) on website:
#toprow {position: static;top:0px}
i have found following code, believe enable me grade color dark blue light blue. despite many attempts, have yet find way build banner:
#grad { background: -webkit-linear-gradient(rgb(0,102,255), rgb(153,204,255)); /* safari 5.1 6.0 */ background: -o-linear-gradient(rgb(0,102,255), rgb(153,204,255)); /* opera 11.1 12.0 */ background: -moz-linear-gradient(rgb(0,102,255), rgb(153,204,255)); /* firefox 3.6 15 */ background: linear-gradient(rgb(0,102,255), rgb(153,204,255)); /* standard syntax (must last) */ }
using this tool, can achieve want. give cross browsers solution also. see below colour gradation given colorzilla:
background: #0066ff; /* old browsers */ background: -moz-linear-gradient(top, #0066ff 0%, #99ccff 100%); /* ff3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0066ff), color- stop(100%,#99ccff)); /* chrome,safari4+ */ background: -webkit-linear-gradient(top, #0066ff 0%,#99ccff 100%); /* chrome10+,safari5.1+ */ background: -o-linear-gradient(top, #0066ff 0%,#99ccff 100%); /* opera 11.10+ */ background: -ms-linear-gradient(top, #0066ff 0%,#99ccff 100%); /* ie10+ */ background: linear-gradient(to bottom, #0066ff 0%,#99ccff 100%); /* w3c */ filter: progid:dximagetransform.microsoft.gradient( startcolorstr='#0066ff', endcolorstr='#99ccff',gradienttype=0 ); /* ie6-9 */
now, if place code in #grad
suppose have html element having id="grad"
.
Comments
Post a Comment