download属性

area要素のdownload属性は、リンク先ドキュメントをダウンロードさせるかどうか、及び、ダウンロード時のファイル名を指定する任意属性。

ブラウザ対応

構文

download属性を指定すると、リンク領域のクリック時、リンク先ドキュメントをダウンロードさせる。

ダウンロードさせる

ダウンロードさせるだけであれば、download属性値は省略できる。

download属性値を省略した場合、元のドキュメント名が、ダウンロード時のファイル名となる。

<area href="URL" alt="代替テキスト" download>

ファイル名を指定してダウンロードさせる

download属性には、ダウンロード時のファイル名を指定できる。

<area href="URL" alt="代替テキスト" download="ファイル名.拡張子">

要点

  • area要素のdownload属性は、リンク先ドキュメントをダウンロードさせるかどうか、及び、ダウンロード時のファイル名を指定する属性である。
  • download属性は、area要素にhref属性がある場合だけ使用する。area要素にhref属性がない場合、download属性は、省略しなければならない。
  • download属性は、HTML5にて新たに導入された属性である。

サンプルコード

ダウンロードさせる

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

ファイル名を指定してダウンロードさせる

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

サンプル

HTMLソースコード

<img src="sample-area.png" usemap="#sample-area-1">
<map name="sample-area-1">
	<area shape="circle" coords="50,50,40" href="sample-area.png" alt="サンプル" download>
	<area shape="rect" coords="110,10,190,90" href="sample-area.png" download="sampleFileName1.png">
	<area shape="polygon" coords="250,10,206,86,294,86" href="sample-area.png" download="sampleFileName2.png">
	<area shape="polygon" coords="350,10,315,30,315,70,350,90,385,70,375,30" href="sample-area.png" download="sampleFileName3.png">
</map>

実際の表示

サンプル