Style Sheets and Forms
One of the most overlooked applications of CSS is to control the appearance
of CGI forms. The standard form buttons are grey, and the input areas
white. As a result, almost all forms on the Web have the same drab color
combinations. CSS gives us a way to change all that. Internet Explorer
4 and some of the more recent versions of Netscape allow CSS rules to
alter the appearance of form components. For example:
|
with these style rules
|
|
.submit {background: green; color: black;}
.reset {background: yellow; color: black;}
|
|
this HTML markup
|
renders like this
|
|---|
|
<input class="submit" type="submit" value="send mail" />
|
|
|
<input class="reset" type="reset" value="cancel mail" />
|
|
You can even control the type font used in a text area
| with this style rule |
|
#message {font-family:"Times New Roman", Times, serif; font-style:
italic; font-size: 1.5em; }
|
|
this HTML markup
|
renders like this
|
|---|
<label for="message">
<textarea name="message" id="message" cols="30" rows="3">
Put your message here.
</textarea>
</label>
|
|
| If you're viewing this page in Netscape, try looking at it in Internet Explorer. This is an example of browser compatibility. |
|
