Image button in HTML
Image button is similar in action to that of submit button, but it looks like an image. This expands designer's abilities to improve the form. When a user clicks on the image, the form data are sent to the server and are processed by the program specified by the parameter action of the tag form.
Image button in a form is created as follows.
<input type="image" parameters>
Field parameters are listed in the table.
| Parameter | Description |
|---|---|
| name | Name of the field. Designed for the program that processes the form, that it would be able to identify this field. |
| src | URL of the image (path to the graphic file). |
| align | Field alignment. Possible values: top, middle, bottom, right, left, texttop, baseline, absmiddle, absbottom. When applied the result is the same as in images. |
| width | Image width. |
| height | Image height. |
| vspace | Vertical spacings around the image at the top and bottom, in pixels. |
| hspace | Horizontal spacings around the image to the left and right, in pixels. |
| border | Determines the width of the border around the image, in pixels. |
How to create an image button is shown in example 1. The table is used to align the elements.
Example 1. Image button.
<form action="/cgi-bin/handler.cgi">
<table align="center">
<tr><td colspan="2">Enter your name:</td></tr>
<tr>
<td><input type="text" size="25"></td>
<td><input type="image" src="/images/imgbutton.gif" width="91" height="25" border="0"></td>
</tr>
</table>
</form>The result is shown below.
