HTML and CSS Reference
In-Depth Information
Every different gradient you want
to use means an extra download
from the server, increasing page-
load times for users and your
bandwidth requirements.
❂
Standard
Prefixed
-
3.0
-
3.6
If the element color will change in
response to user interaction—for
example, a menu item on mouse-
over—you need to make twice as
many images, doubling all the
problems just mentioned.
❂
-
10.0*
-
11.10
-
4.0
*
IE has been able to do simple gradients
with the nonstandard
filter
attribute
since version 5.5.
CSS gradients are allowed anywhere you currently can specify
an image. At this time, browsers only have support for using
them as backgrounds, so the examples concentrate on that.
In this section you'll use a snippet of
HTML
like this:
<div id="gradient">
</div>
You'll also need some basic
CSS
like this:
#gradient {
outline: 1px solid #999;
min-height: 400px;
max-width: 400px;
background: none;
}
The
CSS
snippets shown next should be inserted in place of the
back-
ground: none;
property to achieve the screenshots shown in a support-
ing browser. See the section “Browser support” for details of prefixes
required to access experimental support.
