Definition und Verwendung
Für Knopfelemente, die type angibt Attribut den Typ der Schaltfläche.
Für Eingabeelemente, die type angibt Attribut den Typ des <input> Element angezeigt werden soll .
Für Menüelemente, die type angibt Attribut die Art des Menüs.
Für einbetten, Link, Objekt, Skript, Quelle und Stilelemente, gibt er type-Attribut auf das Internet Medientyp (früher als MIME-Typ bekannt).
Gilt für
Der type - Attribut kann auf die folgenden Elemente verwendet werden:
| Elements | Attribut |
|---|---|
| <button> | type |
| <embed> | type |
| <input> | type |
| <link> | type |
| <menu> | type |
| <object> | type |
| <script> | type |
| <source> | type |
| <style> | type |
Beispiele
Button - Beispiel
Zwei-Knopf-Elemente, die als eine handeln Submit-Button und ein Reset-Taste (in der Form):
<form action="demo_form.asp" 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>
Versuch es selber " Embed Beispiel
Eine eingebettete Flash-Animation mit einer bestimmten Medientyp:
<embed src="helloworld.swf"
type="application/vnd.adobe.flash-movie">
Versuch es selber " Input
Ein HTML-Formular mit zwei verschiedenen Eingangstypen; Text und einreichen:
<form action="demo_form.asp">
Username: <input type="text" name="usrname"><br>
<input type="submit" value="Submit">
</form>
Versuch es selber " Link - Beispiel
Im folgenden Beispiel wird der type zeigt Attribut , dass das verknüpfte Dokument ist ein externes Stylesheet:
<head>
<link rel="stylesheet" type="text/css" href="theme.css">
</head>
Versuch es selber " Menu Beispiel
Ein Kontextmenü:
<menu type="context" id="mymenu">
<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> Versuch es selber " Object
Ein <object> Element mit einer bestimmten Medientyp:
<object width="400" height="400" data="helloworld.swf"
type="application/vnd.adobe.flash-movie"></object>
Versuch es selber " Script Beispiel
Ein Skript mit dem type - Attribut angegeben:
<script type="text/javascript">
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
Versuch es selber " Source Beispiel
Die Verwendung des type - Attribut:
<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>
Versuch es selber " Style - Beispiel
Verwenden Sie den type Attribut den Medientyp des zu spezifizieren <style> tag:
<style type="text/css">
h1 {color:red;}
p {color:blue;}
</style>
Versuch es selber " Browser-Unterstützung
Der type - Attribut hat die folgende Browser - Unterstützung für jedes Element:
| Element | |||||
|---|---|---|---|---|---|
| button | ja | ja | ja | ja | ja |
| embed | ja | ja | ja | ja | ja |
| input | ja | ja | ja | ja | ja |
| link | ja | ja | ja | ja | ja |
| menu | Nicht unterstützt | Nicht unterstützt | 8.0 (Nur Typ = "Kontext") | Nicht unterstützt | Nicht unterstützt |
| object | ja | ja | ja | ja | ja |
| script | ja | ja | ja | ja | ja |
| source | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
| style | ja | ja | ja | ja | ja |