I've been exploring some elements of HTML5 and was happy to see a new tool in one of the add-ons (extensions) of Firefox that helps me understand the use of CSS gradients.
Colorzilla has a tool called CSS Gradient Generator which generates the CSS style(s) for whichever colors you choose, etc. I say styles because it uses the style elements for different browsers. Here is an example:
---------------------------
<style type="text/css">
<!--
.boxback{
background: -moz-linear-gradient(left, #f1e767 0%, #feb645 100%); /* firefox */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#f1e767), color-stop(100%,#feb645)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e767', endColorstr='#feb645',GradientType=1 ); /* ie */
}
-->
</style>
---------------------------
Note: Just in case you are unfamiliar with what "webkit" is: WebKit is an open source web browser engine. WebKit is also the name of the Mac OS X system framework version of the engine that's used by Safari.
You can see this work in a sample file that I created and loaded on the LS Web Site:
http://library.austincc.edu/gradient-demo.htm
