type属性

area要素のtype属性は、リンク先ドキュメントのMIMEタイプを指定する任意属性。

ブラウザ対応

構文

<area href="URL" alt="代替テキスト" type="MIMEタイプ">

MIMEタイプ

代表的なMIMEタイプ。

  • text/html：HTML
  • text/xml：XML
  • text/css：スタイルシート（CSS）
  • text/plain：テキスト
  • image/png：PNG
  • image/jpeg：JPEG
  • image/gif：GIF
  • audio/mpeg：MP3
  • video/mpeg：MPEG
  • video/mp4：MP4
  • application/pdf：PDF
  • application/x-shockwave-flash：Flash

要点

  • area要素のtype属性は、リンク先ドキュメントのMIMEタイプを指定する属性である。
  • type属性は、area要素にhref属性がある場合だけ使用する。area要素にhref属性がない場合、type属性は、省略しなければならない。
  • type属性は、HTML5にて新たに導入された属性である。

サンプルコード

HTML

<area shape="rect" coords="0,0,100,50" href="sample.html" alt="サンプル" type="text/html">

PNG

<area shape="rect" coords="0,0,100,50" href="sample.png" alt="サンプル" type="image/png">

サンプル

HTMLソースコード

<img src="sample-area.png" usemap="#sample-area">
<map name="sample-area">
	<area shape="circle" coords="50,50,40" href="http://html5.cyberlab.info" alt="ホーム" type="text/html">
	<area shape="rect" coords="110,10,190,90" href="http://html5.cyberlab.info/elements/embedded/" alt="埋め込みコンテンツ" type="text/html">
	<area shape="polygon" coords="250,10,206,86,294,86" href="http://html5.cyberlab.info/elements/embedded/area-target.html" alt="target属性" type="text/html">
	<area shape="polygon" coords="350,10,315,30,315,70,350,90,385,70,375,30" href="http://html5.cyberlab.info/elements/embedded/area-type.html" alt="type属性" type="text/html">
</map>

実際の表示

ホーム 埋め込みコンテンツ target属性 type属性