HTML type Attribute
Definition and Usage
For button elements, the type attribute specifies the type of button.
For input elements, the type attribute specifies the type of <input> element to display.
For menu elements, the type attribute specifies the type of menu.
For embed, link, object, script, source, and style elements, he type attribute specifies the Internet media type (formerly known as MIME type).
Applies to
The type attribute can be used on the following elements:
Elements | Attribute |
---|---|
<button> | type |
<embed> | type |
<input> | type |
<link> | type |
<menu> | type |
<object> | type |
<script> | type |
<source> | type |
<style> | type |
Examples
Button Example
Two button elements that act as one submit button and one reset button (in a form):
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<button type="submit" value="Submit">Submit</button>
<button type="reset" value="Reset">Reset</button>
</form>
Embed Example
An embedded flash animation with a specified media type:
Input Example
An HTML form with two different input types; text and submit:
Username: <input type="text" name="usrname"><br>
<input type="submit" value="Submit">
</form>
Link Example
In the following example, the type attribute indicates that the linked document is an external style sheet:
<link rel="stylesheet" type="text/css" href="theme.css">
</head>
Menu Example
A context menu:
<menuitem label="Refresh" onclick="window.location.reload();" icon="ico_reload.png">
</menuitem>
<menu label="Share on...">
<menuitem label="Twitter" icon="ico_twitter.png"
onclick="window.open('//twitter.com/intent/tweet?text='+window.location.href);">
</menuitem>
<menuitem label="Facebook" icon="ico_facebook.png"
onclick="window.open('//facebook.com/sharer/sharer.php?u='+window.location.href);">
</menuitem>
</menu>
<menuitem label="Email This Page"
onclick="window.location='mailto:?body='+window.location.href;"></menuitem>
</menu>
Object Example
An <object> element with a specified media type:
Script Example
A script with the type attribute specified:
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
Source Example
Use of the type attribute:
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
Style Example
Use the type attribute to specify the media type of the <style> tag :
h1 {color:red;}
p {color:blue;}
</style>
Browser Support
The type
attribute has the following browser support for each element:
Element | |||||
---|---|---|---|---|---|
button | Yes | Yes | Yes | Yes | Yes |
embed | Yes | Yes | Yes | Yes | Yes |
input | Yes | Yes | Yes | Yes | Yes |
link | Yes | Yes | Yes | Yes | Yes |
menu | Not supported | Not supported | 8.0 (only type="context") |
Not supported | Not supported |
object | Yes | Yes | Yes | Yes | Yes |
script | Yes | Yes | Yes | Yes | Yes |
source | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
style | Yes | Yes | Yes | Yes | Yes |