HTML type Attribute: This attribute can be used for the button elements, the type attribute specifies the type of button. It can be applied on <button>,<embed>,<input>,<link>,<menu>,<object>,<script>,<source>,<style> elements.
HTML type Attribute
For embed, link, object, script, source, and style elements, the type attribute specifies the Internet media type.
Browser Support
This attribute is supported by the following browsers:
- Chrome
- Firefox
- Safari
- Opera
- Internet Explorer
Example: for <button> element
<!DOCTYPE html> <html> <body> <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> </body> </html>
Output:
Example: for <embed> element
<!DOCTYPE html> <html> <body> <embed src="helloworld.swf" type="application/x-shockwave-flash"> </body> </html>
Output:
Example: for <input> element
<!DOCTYPE html> <html> <body> <form action="/action_page.php"> Username: <input type="text" name="usrname"><br> <input type="submit" value="Submit"> </form> </body> </html>
Output:
Example: for <link> element
<!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="styles.css"> </head> <body> <h1>I am formatted with a linked style sheet</h1> <p>Me too!</p> </body> </html>
Output:
Example: for <object> element
<!DOCTYPE html> <html> <body> <object width="400" height="400" data="helloworld.swf" type="application/vnd.adobe.flash-movie"> </object> </body> </html>
Example: for <script> element
<!DOCTYPE html> <html> <body> <p id="demo"></p> <script type="application/javascript"> document.getElementById("demo").innerHTML = "Hello JavaScript!"; </script> </body> </html>
Output:
Hello JavaScript!
Example: for <source> element
<!DOCTYPE html> <html> <body> <audio controls> <source src="horse.ogg" type="audio/ogg"> <source src="horse.mp3" type="audio/mpeg"> </audio> </body> </html>
Example: for <style> element
<!DOCTYPE html> <html> <head> <style> h1 {color:red;} p {color:blue;} </style> </head> <body> <h1>This is a heading</h1> <p>This is a paragraph.</p> </body> </html>
Output: