본문 바로가기
프로그래밍/HTML & CSS

[HTML] <a> 태그 download 속성

by bits 2022. 1. 20.

HTML5 <a> anchor 태그에서 download 속성 사용하기

 

사용자가 해당 링크를 클릭 할 때 download 속성을 두면 링크된 파일을 무조건 다운로드합니다.

<a href="/images/sample.jpg" download>다운로드</a>

 

다운로드 하는 파일명 바꾸기

download 속성은 옵션으로 다운로드 후 저장될 파일의 이름이됩니다. 

<a download="filename">

 

허용되는 값에는 제한이 없으며 브라우저는 올바른 파일 확장자를 자동으로 감지하여 파일 (.img, .pdf, .txt, .html 등)에 추가합니다.

 

값을 생략하면 원래 파일 이름이 사용됩니다.

아래 코드는  sample.jpg 대신에 test.jpg 파일명으로 다운로드 됩니다.

<a href="/images/sample.jpg" download="test.jpg">다운로드</a>

 

지원 브라우저

크롬 : 14.0*

익스플로러 18.0

파이어폭스 : 20.0*

사파리 : 10.1

오페라 : 15.0

 

* Chrome 65 이상 및 Firefox는 동일 출처(same-origin) 다운로드 링크만 지원합니다.

 

'프로그래밍 > HTML & CSS' 카테고리의 다른 글

[HTML] <meta> http-equiv 속성 알아보기  (2) 2021.01.25

댓글