HTML and CSS Reference
In-Depth Information
Figure 5-9 shows the result of this snippet.
Figure 5-9. Linear gradient with a bottom-left starting point
You can also specify the gradient's start point in degrees. For instance, setting
the start point to be 45deg will have the same results as setting the start point as
bottom left .
.box {
background: -webkit-linear-gradient(45deg, green, red);
}
Along with standard two-color gradients, you can also use several colors within
a gradient background. You simply specify more colors after the position. For
instance, the following code will create an Irish flag using a linear gradient, as
shown in Figure 5-10.
.box {
background: -webkit-linear-gradient(left, green, white, orange);
}
Search WWH ::




Custom Search