ywork2020.com

Title

タイプ属性を使えば、コントロール要素のタイプやソースファイルの種類が指定できる

type属性の概要

type属性は主にWebページに配置されるコントロール要素の種類を指定する場合や、 外部ソースの参照を行う時に、ファイルの種類を明示的に指定する場合に用いられる属性です。

コントロール要素ではinput要素のtype属性は種類が多く、一度は目に触れたことがあるのではないでしょうか。 次項のサンプルで是非確認してみてください。ちなみにinput要素のtypeの既定値は"text"ですので指定しない場合はテキストボックスが設置されます。

また、外部ソースで、よく見かけるものにlink要素の「text/css」やscript要素の「text/javascript」があるのではないでしょうか。 これは、ひと昔前に使用されていたコードなどを見ると「text/css」や「text/javascript」が記述されているのを見かけると思います。 このlink要素の「text/css」やscript要素の「text/javascript」に関しては、HTML5では既定値として設定されているので、 別のMIMEタイプのファイルを使わないかぎりは記述する必要はありません。 むしろ、冗長なコードを控える意味で記述しないことが、推奨されています。

実機サンプルとMIMEタイプ

コントロール系の要素に使われるtype属性値と実機サンプルの参考表

要素名type属性値実機サンプル
buttonbutton
buttonnenu
buttonreset
buttonsubmit
inputbutton
inputcheckbox
inputcolor
inputdate
inputdatetime
inputdatetime-local
inputemail
inputfile
inputhidden
inputimage
inputmonth
inputnumber
inputpassword
inputradio
inputrange
inputreset
inputsearch
inputsubmit
inputtel
inputtext
inputtime
inputurl
inputweek
ol1
  1. リスト
  2. リスト
olA
  1. リスト
  2. リスト
ola
  1. リスト
  2. リスト
olI
  1. リスト
  2. リスト
oli
  1. リスト
  2. リスト

外部リソース参照系の要素に使われるtype属性値のMIMEタイプの参考表

MIMEタイプ(マイムタイプ)とはファイルの種類のことです。(例として一部のみの記載)
MIMEタイプの分類と種類データ形式
text/cssCSS
text/htmlHTML文書
text/javascriptJavaScript
text/plainプレーンテキスト
image/pngPNG形式の画像
image/gifGIF 形式の画像
image/jpegJPEG 形式の画像
video/mp4MPEG-4 形式の動画
video/webmvendorWebM 形式の動画
audio/mp3MP3 形式の音声データ
application/javascriptJavaScript
application/xhtml+xmlXHTML文書
application/xmlXML文書
application/vnd.ms-wordMicrosoft Word文書(vendorタイプ)
application/x-lzhLZH圧縮ファイル(非公式のサブタイプ)
application/octet-streamバイナリ形式ファイル