<input type="image">
| Browser |
|
|---|---|
| Type |
The INPUT element defines an input field. When you specify "image" for the type attribute of this element, an image submit button is created.
<input type="image" src="button.gif" alt="Submit">
<input type="image" src="button.gif" alt="Submit" align="right">
| Attribute | Value | Explanation |
|---|---|---|
| type=" " | image | the type of input field |
| name=" " | button name | a unique name for the button |
| src=" " | URL | the URL of the image to display |
| alt=" " | alternate text | short description |
| align=" " | top, middle, bottom,left, right | image alignment (Deprecated) |
- type="image"
- Creates an image submit button. When this button is clicked, the form data is submitted to the server.
- name=""
- The button name is used to identify the clicked image submit button.
- src=""
- Specifies the URL of the image used for the button.
- alt=""
- Specifies the alternative text of the image.
- align=""
- Specifies how to align the image. The use of this attribute is deprecated. (Use CSS instead)
The coordinates within the image
When the image button is clicked, the coordinates of the clicked position is submitted to the server.
When this image is clicked, the coordinates are displayed in the address bar of the browser.
Example :
x=120&y=50
When you set the button name.
The button name is "Example"
Example :
Example.x=120&Example.y=50
Example
<form method="GET" action="example.cgi">
<p><input type="text" name="name" size="30"></p>
<p><input type="image" src="image/button.gif" alt="Submit"></p>
</form>
- Output
This form cannot submit because of a sample.
<form method="GET" action="example.cgi">
<p><input type="text" name="name" size="30"></p>
<p>
<input type="image" src="image/b01.gif" name="button_a" alt="Button A">
<input type="image" src="image/b02.gif" name="button_b" alt="Button B">
<input type="image" src="image/b03.gif" name="button_c" alt="Button C">
</p>
</form>
- Output
This form cannot submit because of a sample.