input type='image' - HTML CSS HTML Tag

HTML CSS examples for HTML Tag:input

  1. HOME
  2. HTML CSS
  3. HTML Tag
  4. input

Introduction

The image type of input element creates buttons that display an image and submit the form when clicked.

This type of input element supports the additional attributes shown in the following table.

Attribute
 Description
 New in HTML5
alt

 Provides a text description of the element. This is useful for
users who require assistive technologies.
No

formaction
 form action
 Yes
formenctype
 form type
 Yes
formmethod
 form submit method
 Yes
formtarget
 form target
 Yes
formnovalidate
 form validation method
 Yes
height
 Specifies the height of the image in pixels
 No
src
 Specifies the URL for the image that should be displayed.
 No
width
 Specifies the width of the image in pixels
 No

Using the image Type of the input Element

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
   <head> 
      <title>Example</title> 
   </head> 
   <body> 
      <form method="post" action="http://example.com/form"> 
         <input type="hidden" name="recordID" value="1234"> 
         <p> 
            <label for="name">
                Name: <!--  w  w w . j  a v  a2 s  . c om-->
               <input value="java2s.com" id="name" name="name"> 
            </label> 
         </p> 
         <p> 
            <label for="password">
                Password: 
               <input type="password" placeholder="Min 6 characters" id="password" name="password"> 
            </label> 
         </p> 
         <p> 
            <label for="fave">
                Favorite Fruit: 
               <input type="text" id="fave" name="fave"> 
            </label> 
         </p> 
         <input type="image" src="https://www.java2s.com/style/demo/Opera.png" name="submit"> 
      </form>  
   </body>
</html>

Related Tutorials