HTML type Attribute

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:

HTML type attribute

Example: for <embed> element

<!DOCTYPE html>
<html>
<body>
<embed src="helloworld.swf" type="application/x-shockwave-flash">
</body>
</html>

Output:

HTML embedded element1

HTML embedded element

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:

HTML type attribute

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:

HTML link element

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:

HTML type attribute