|
Member of:
 ISOC
 IWA
 ARTT
 RTS
| |
How to Make a Gradient Background
Gradients are colors that blend into each other to form an ongoing color
shift. This effect is highly appealing, and used generally in graphic
design, rather than with Web pages. However, a simple style appended to your
page's Body Tag can create a very nice gradient fill to form a background to
the page.
This style can be applied to your entire page by using it within the Body
Tag, or you can choose to add fills to tables by employing the same code
with your Table Tags.
Consider the following code for use in your body tag to add a gradient to
the whole page:
<body style="filter:progid:DXImageTransform.Microsoft.Gradient(endColorstr='#ccffcc',
startColorstr='#FFFFFF', gradientType='0');"></body>
Now transport this to an HTML table (note how we reversed the color order
for the table):
<table style="filter:progid:DXImageTransform.Microsoft.Gradient(endColorstr='#ffffff',
startColorstr='#ccffcc', gradientType='0');"><tr><td>adfad<br><br></td></tr></table>
Remember, the gradient runs from one color to the other, so you want to have
highly contrasting colors for your two input values to take advantage of the
full effect. Also note the gradientType, which is specified in our example
as "0". This produces a vertical blend. If we set this value to "1" we get a
horizontal gradation.
| |
|