Earn income with your HTML skills
Sign up and we'll send you the best freelance opportunities straight to your inbox.
We're building the largest self-service freelancing marketplace for people like you.

HTML <input> alt Attribute

The alt attribute on an <input> tag defines alternative text.

This attribute only applies to <input> elements of type image.

Alternative text only shows when the image cannot be loaded.

Example

#

An alt attribute on an <input> element. The image button is loaded correctly, therefore alternative text does not display.






<form action="/tutorial/action.html">
  <label for="firstname">First name</label><br />
  <input type="text" id="firstname" name="firstname"><br />
  
  <label for="lastname">Last name</label><br />
  <input type="text" id="lastname" name="lastname"><br /><br />

  <input type="image" alt="Submit" width="40" height="40"
         src="/img/html/arrow.png">
</form>


In this example the image name has a typo and cannot be loaded.
The alt text displays next to an icon of a broken image. The submit button is still functional.






<form action="/tutorial/action.html">
  <label for="firstname">First name</label><br />
  <input type="text" id="firstname" name="firstname"><br />

  <label for="lastname">Last name</label><br />
  <input type="text" id="lastname" name="lastname"><br /><br />

  <input type="image" alt="Submit" width="40" height="40" 
         src="/img/html/arrarow.png">
</form>

Using alt

Alternative displays when the <input> image cannot be loaded.

Alternative text is also used by screen readers, search engines, etc.

Tip: Use the alt attribute on all your image inputs.


Syntax

<input src="URL" alt="text">

Values

#

Value Description
text Alternative text for the image <input>.

Browser support

Here is when src support started for each browser:

Chrome
1.0 Sep 2008
Firefox
1.0 Sep 2002
IE/Edge
1.0 Aug 1995
Opera
1.0 Jan 2006
Safari
1.0 Jan 2003

You may also like

 Back to <input>
Earn income with your HTML skills
Sign up and we'll send you the best freelance opportunities straight to your inbox.
We're building the largest self-service freelancing marketplace for people like you.

Guides