Зміст курсу
Ultimate HTML
Ultimate HTML
Використання Посилань і Кнопок у HTML
Посилання
Тег <a>
використовується для створення гіперпосилань, які дозволяють користувачам переходити між різними веб-сторінками. Коли користувач натискає на посилання, браузер надсилає запит на сервер для сторінки, пов'язаної з цим посиланням, і відображає відповідь на екрані. Атрибут href
допомагає вказати URL цільової сторінки.
index.html
Атрибути посилань
target
За замовчуванням посилання відкривається в тій самій вкладці браузера. Атрибут target
дозволяє змінити цю поведінку. Щоб відкрити посилання в новій вкладці, використовуйте target="_blank"
.
index.html
download
Атрибут download
можна використовувати з HTML-тегом <a>
, щоб вказати, що цільовий ресурс має бути завантажений, а не відображений у браузері. Коли використовується атрибут download
, браузер пропонує користувачу зберегти файл із зазначеним іменем. Наприклад, якщо потрібно створити елемент із такою функціональністю: при натисканні на посилання браузер завантажить файл "myfile.pdf" з https://example.com/
і запропонує зберегти його під іменем myfile.pdf.
index.html
href
Атрибут href
використовується не лише для переходу на інші сторінки, а й для створення посилань на електронні адреси, телефонні номери та конкретні розділи.
index.html
Крім того, атрибут href
можна використовувати для навігації до певних розділів на веб-сторінці. Щоб створити якірне посилання, призначте атрибут id
(унікальний ідентифікатор) розділу, до якого потрібно прокрутити сторінку. Атрибут href
приймає значення, що починається зі символу #
, після якого вказується значення id
.
Розглянемо наступний приклад, представлений у вигляді CodeSandbox. Ця платформа дозволяє переглядати код і досліджувати його функціональність.
Примітка
Будь ласка, ознайомтеся з функціональністю, натискаючи на посилання та спостерігаючи, як жива сторінка прокручується до відповідних розділів. Також зверніть увагу на атрибути тегів
a
таh2
.Щоб переглянути код, перетягніть повзунок з лівого боку CodeSandbox. Це відкриє наявний код у редакторі.
Кнопка
Тег <button>
в HTML використовується для створення клікабельної кнопки, яка може виконувати дію, наприклад, надсилати форму, запускати JavaScript-функцію (наприклад, відкривати або закривати спливаюче вікно) чи перемикати мобільне меню. За замовчуванням тег <button>
має атрибут type
, значенням якого є submit
. Однак часто потрібно явно вказувати type="button"
.
index.html
Підсумок
Тег <a>
використовується для створення гіперпосилань на інші веб-сторінки, документи або ресурси. Натомість тег <button>
застосовується для додавання інтерактивності на веб-сторінці, ініціювання події або виконання дії. Важливо не плутати їх призначення.
1. Яка основна функція тега <a>
?
2. Чи можна використовувати тег <button>
для надсилання форми?
3. У чому основна відмінність між тегом <a>
та тегом <button>
?
Дякуємо за ваш відгук!