Cascading Style Sheets (CSS); Backgrounds (part 2 of 2)
By Will Bontrager
2003-10-15
Reader Rating:

The Background Behind INPUT and TEXTAREA Form Elements
The background of form INPUT and TEXTAREA fields can be a specific color or an image. To make all INPUT areas yellow and put an image in the TEXTAREA field, put this in the HEAD section of your web page:
<style type="text/css">
<!--
INPUT { background-color: yellow; }
TEXTAREA { background-image: url(image.jpg); }
-->
</style>
Now, all INPUT and TEXTAREA fields will contain the background you specified. Example:
<form>
Your Name:
<INPUT type="text">
Narrative:
<TEXTAREA cols="11" rows="5"></TEXTAREA>
<INPUT type="submit">
</form>
Because the submit button is also an INPUT field, it will have the same background as text input fields. If you prefer to have the background of the submit button be blue (for example, it could be any color or even an image), create a custom class and then specify that style for the submit button.
Copyright 2004 Bontrager Connection, LLC
If you found this article interesting, you may want to read these as well:
» Cascading Style Sheets (CSS); Backgrounds (part 1 of 2)
» Cascading Style Sheets (CSS); Learning More
» Cascading Style Sheets (CSS); Getting Started
|