Атрибут download тега <a> — завантажити файл
автор: NagarD
Загальний опис
автор: NagarD
Синтаксис
<a download=”filename”>
Атрибут download може отримувати єдине значення:
-
filename -
Необов'язково. Задає нове ім'я файлу для завантажуємого файлу.
автор: NagarD
Переглядачі
| Переглядач | ||||||
|---|---|---|---|---|---|---|
| 14 | 20 | 10.1 | 15 | 18 | — |
| Переглядач | ||||
|---|---|---|---|---|
| 4.4 | 18 | 20 | 13 |
Приклади
+ запропонувати свій приклад у пісочниці
download велить не відкривати адресу, а зберегти її як файл із заданим іменем: клацни — браузер запропонує pryvit.txt. Працює для адрес свого походження та data:/blob:; у вбудованій пісочниці завантаження може бути заблоковане — спробуй на повній сторінці прикладу.
<a href="data:text/plain;charset=utf-8,Привіт від css.in.ua!" download="pryvit.txt">Завантажити pryvit.txt</a>
Дві однакові адреси, різниця лише в атрибуті: перше посилання браузер відкриє, друге — збереже під іменем notatka.txt. Файл вбудований у саму адресу через data:, тож нічого зовнішнього не завантажується.
HTML
<p><a href="data:text/plain;charset=utf-8,%D0%97%D0%B2%D1%96%D1%82%20%D0%B7%D0%B0%20%D0%BB%D0%B8%D0%BF%D0%B5%D0%BD%D1%8C%202026%0A%D0%A3%D1%81%D1%8C%D0%BE%D0%B3%D0%BE%3A%20128%20%D0%BF%D0%BE%D0%B7%D0%B8%D1%86%D1%96%D0%B9%0A">Без download — відкриється у вкладці</a></p>
<p><a download="notatka.txt" href="data:text/plain;charset=utf-8,%D0%97%D0%B2%D1%96%D1%82%20%D0%B7%D0%B0%20%D0%BB%D0%B8%D0%BF%D0%B5%D0%BD%D1%8C%202026%0A%D0%A3%D1%81%D1%8C%D0%BE%D0%B3%D0%BE%3A%20128%20%D0%BF%D0%BE%D0%B7%D0%B8%D1%86%D1%96%D0%B9%0A">З download — збережеться як notatka.txt</a></p>
CSS
p { margin: 0 0 12px; }
a { display: inline-block; padding: 8px 14px; border: 1px solid #127a4d; border-radius: 6px; color: #127a4d; text-decoration: none; }
a:hover { background: #127a4d; color: #fff; }
Різниця між HTML 4.01 та HTML5
Атрибут download для теґу <a> з’явився тільки у HTML5.
Коментарі
Коментарів ще немає — будьте першим!