HTML type Атрибут
Определение и использование
Для элементов button атрибут type указывает тип кнопки.
Для входных элементов атрибут type указывает тип элемента <input> для отображения.
Для элементов меню атрибут type указывает тип меню.
Для встраивания, связывания, объекта, сценария, источника и стиля, атрибут type указывает тип Интернет-носителя (ранее известный как тип MIME).
Относится к
Атрибут type может использоваться для следующих элементов:
| Элементы | Атрибут |
|---|---|
| <button> | type |
| <embed> | type |
| <input> | type |
| <link> | type |
| <menu> | type |
| <object> | type |
| <script> | type |
| <source> | type |
| <style> | type |
Пример
Пример кнопки
Два элемента Button, которые действуют как одна кнопка отправки и одна кнопка сброса (в форме):
<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>
Пример встраивания
Встроенная флэш-анимация с указанным типом носителя:
<embed src="helloworld.swf" type="application/vnd.adobe.flash-movie">
Пример ввода
HTML-форма с двумя различными типами входных данных; текст и представить:
<form action="/action_page.php">
Username: <input type="text" name="usrname"><br>
<input type="submit" value="Submit">
</form>
Пример ссылки
В следующем примере атрибут type указывает, что связанный документ является внешней таблицей стилей.
<head>
<link rel="stylesheet" type="text/css" href="theme.css">
</head>
Пример меню
Контекстное меню:
<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>
Пример объекта
Элемент <object> с указанным типом носителя:
<object width="400" height="400" data="helloworld.swf" type="application/vnd.adobe.flash-movie"></object>
Пример сценария
Сценарий с указанным атрибутом type:
<script type="text/javascript">
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
Пример источника
Использование атрибута type:
<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>
Пример стиля
Используйте атрибут type для указания типа носителя тега <style>:
<style type="text/css">
h1 {color:red;}
p {color:blue;}
</style>
Поддержка браузера
Атрибут type имеет следующую поддержку браузера для каждого элемента:
| Элемент | |||||
|---|---|---|---|---|---|
| button | Да | Да | Да | Да | Да |
| embed | Да | Да | Да | Да | Да |
| input | Да | Да | Да | Да | Да |
| link | Да | Да | Да | Да | Да |
| menu | Не поддерживается | Не поддерживается | 8.0 (only type="context") |
Не поддерживается | Не поддерживается |
| object | Да | Да | Да | Да | Да |
| script | Да | Да | Да | Да | Да |
| source | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
| style | Да | Да | Да | Да | Да |