Your Guide to Professional
Web Site Design and Development

HTML Codes
Web Development
Web Design Tips
JavaScript Codes
216 Web Safe Colors
CSS Tutorial
JavaScript Tutorial
ASCII Character Codes

Offering a guide to professional web site design, web page design and web design guidelines

| Web Site Development | HTML Codes | HTML Tips | Web Design TipsJavascript Snippets | 216 Safe Colors | Symbols | CSS Tutorial | JavaScript Tutorial |

Using an Image as a Submit Button within an HTML Web Page

Instead of using the standard form submit button, you can use an image.

Place the following code within your FORM code.

<FORM METHOD=post ACTION="/cgi-bin/example.cgi">
<INPUT type="text">
<INPUT type=image name="submit" src="yourimage.gif" border="0">

Browser View:

This example displays a text box with an image submit button. Notice the uneven alignment.

In the next example, this same text box and image will be displayed within a table with the background color set to the same color as the image background.

<FORM METHOD=post ACTION="/cgi-bin/example.cgi">
<TD BGCOLOR="#8463FF">
<INPUT type="text" size="10" maxlength="30">
<TD BGCOLOR="#8463FF" VALIGN="Middle">
<INPUT type=image name="search" SRC="yourimage.gif" border="0">

When using an image to replace the standard submission button, make sure you include, "BORDER=0," as the Netscape browser will show a border.

 More Web Design Tips