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 <embed>,
<link>, <object>,
<script>, <source>, and
<style> elements, the 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 |
|---|---|
| <a> | type |
| <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):
<form action="/action_page.php" method="get">
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>
Try it Yourself »
Embed Example
An embedded flash animation with a specified media type:
<embed src="helloworld.swf" type="application/vnd.adobe.flash-movie">
Try it Yourself »
Input Example
An HTML form with two different input types; text and submit:
<form action="/action_page.php">
Username: <input type="text" name="usrname"><br>
<input type="submit" value="Submit">
</form>
Try it Yourself »
Link Example
In the following example, the type attribute indicates that the linked document is an external style sheet:
<head>
<link rel="stylesheet" type="text/css" href="theme.css">
</head>
Try it Yourself »
Object Example
An <object> element with a specified media type:
<object width="400" height="400" data="helloworld.swf" type="application/vnd.adobe.flash-movie"></object>
Try it Yourself »
Script Example
A script with the type attribute specified:
<script type="text/javascript">
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
Try it Yourself »
Source Example
Use of the type attribute:
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
Try it Yourself »
Style Example
Use the type attribute to specify the media type of the <style> tag :
<style type="text/css">
h1 {color:red;}
p {color:blue;}
</style>
Try it Yourself »
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 |
| 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 |
