HTML and CSS Reference
In-Depth Information
The standard syntax described so far is supported in Chrome 26+, Firefox 16+,
IE10+, Safari 6.1+, and Opera 12.1+. Legacy syntaxes can be used together with the -moz ,
-webkit , and -o prefixes to expand support down to Firefox 3.6, Chrome 1, Safari 4, and
Opera 11.1.
.linear-gradient
{
background-color: red; /* fallback color */
/* Chrome 1-9, Safari 4-5 */
background: -webkit-gradient(linear, left top, right top, from(red),
to(orange));
/* Chrome 10-25, Safari 5.1-6.1 */
background: -webkit-linear-gradient(left, red, orange);
/* Firefox 3.6-15 */
background: -moz-linear-gradient(left, red, orange);
/* Opera 11.1-12.1 */
background: -o-linear-gradient(left, red, orange);
/* Standard syntax */
background: linear-gradient(to right, red, orange);
}
Radial gradients
A radial gradient transitions outward from a central point. In CSS, these gradients are
defined with the radial-gradient() function.
radial-gradient([<shape> + <size>] [at <position>]
{, <color stop> [stop position]} {2-∞} )
To create a radial gradient, at least two color stops must be defined. The radial
gradient in Figure 15-4 starts as gray in the center and fades to black.
radial-gradient(gray, black);
 
Search WWH ::




Custom Search