Forms - Images

Section 1 - Introduction
Section 2 - Basics
Section 3 - Next Level
Section 4 - Advanced
      Forms
         How forms are sent
         Input field
         Buttons
         Input types
         Fieldset
         For more help...
         You try it
      Advanced Tables
      Frames
      Style Sheets
      Image Maps
Section 5 - Publishing
Section 6 - Extras
Appendices
Images:
At any point in between the <form> and </form> tags, you can put pictures. The same rules apply to these pictures as any other pictures in a web document. There is one more thing you can do with pictures though, and it's pretty nifty. You can make your "submit" button an image.

Instead of the <input type="submit"> tag, you'll make a different type of input tag. It looks like this:
<input type="image" src="peng.jpg">
You can add to this tag any attributes you usually add to a picture. You can add or remove a border, add an "alt" tag, specify size and alignment. Please make sure that your users know that the image is supposed to be clicked. The following picture is not too obvious.
Code
<form method="POST" action="mailto:myaddress@mail.com">
<input type="text" name="typehere" size="12"> Your name<br>
<input type="image" src="penga.jpg" border="3">
</form>
What you see
Your name


You can click on the picture above. It won't do much, but that's a picture input.
  1. Text
  2. Checkboxes
  3. Radio Buttons
  4. Passwords
  5. Hidden
  6. File
  7. Image
  8. Textarea
  9. Select and Option
Back Home Forward