The HTML download attribute specifies that the target will be downloaded when clicking on the hyperlink. It is used only if the href attribute is set.
The value of the attribute is the name of the downloaded file. The browser automatically identifies the correct file extension and adds it to the file (e.g., .img, .txt, .pdf,). The browser will use the original filename if the value is omitted.
You can use the download attribute on the following elements: <a> and <area>.
Syntax
<tag download></tag>Example of the HTML download attribute used on the <a> element:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<h1>Click on the logo to download it:</h1>
<p>
<a href="/uploads/media/default/0001/01/0710cad7a1017902166203def268a0df2a5fd545.png" download>
<img src="/uploads/media/default/0001/01/0710cad7a1017902166203def268a0df2a5fd545.png" alt="W3Docs" width="190" height="45">
</a>
</p>
</body>
</html>Example of the HTML download attribute used on the <area> element:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<p>Click on one of the HTML, CSS or PHP logo and download it:</p>
<img src="/uploads/media/news_gallery/0001/01/thumb_316_news_gallery_list.jpeg" width="250" height="150" alt="block" usemap="#blockmap">
<map name="blockmap">
<area shape="circle" coords="50,32,25" alt="html" href="/uploads/media/book_gallery/0001/01/d450f0358f947dffb3af91195c3002600d74101b.png" download>
<area shape="circle" coords="218,115,25" alt="css" href="/uploads/media/book_gallery/0001/01/25521e981b34da57c8f51baddc5b76351b855818.png" download>
<area shape="circle" coords="195,32,28" alt="php" href="/uploads/media/book_gallery/0001/01/4bbee6698c4884f25c46010d61b658dd62d2c04f.png" download>
</map>
</body>
</html>Practice Your Knowledge
What does the HTML download attribute do?
Correct!
Incorrect!
Quiz Time: Test Your Skills!
Ready to challenge what you've learned? Dive into our interactive quizzes for a deeper understanding and a fun way to reinforce your knowledge.