HTML: PDFファイルをダウンロードさせるリンク

サイト内にあるPDFファイルに対してリンクを貼って ダウンロードしてもらう場合は、 次のようにHTMLのaタグのhref属性とdownload属性を記述します。

<a href="sample.pdf" download="sample.pdf">サンプルPDFファイル</a>

「href属性」の値はPDFファイルのパスを記述します。
htmlファイルと同じディレクトリにPDFがある場合は上記のように「sample.pdf」と 記述すれば大丈夫ですが、 違うディレクトリ(階層)にある場合は相対パスか 絶対パスでファイルパスがわかるように指定します。

「href属性」だけを指定していると、ブラウザ内でPDFファイルが表示されます。 ダウンロードさせたい場合は「download属性」も合わせて表示します。

「download属性」の値にはダウンロードしてパソコン等に保存されるときの ファイル名を記述します。ですから次のように「href属性」に記述したファイル名とは 違うファイル名を指定することもできます。

<a href="sample.pdf" download="download.pdf">サンプルPDFファイル</a>

download属性のあるリンクをクリックした場合の動作は、 ブラウザによって違います。 保存場所の確認画面を表示するものもあれば、 いきなり保存するブラウザもあります。

HTML・CSS入門