Тег <base>

Тег <base> (укр. — “базова адреса”) в HTML використовується для встановлення базової адреси (URL) для всіх відносних посилань на сторінці. Це дозволяє уникати дублювання домену або директорій у великій кількості посилань, скриптів, стилів чи медіафайлів.

Тег <base> завжди розміщується всередині <head> документа і може бути лише один на сторінці.

Атрибути

Специфічні атрибути

  • href — визначає базову URL-адресу для всіх відносних шляхів у документі. Наприклад:
<base href="https://example.com/subfolder/">
  • target — задає значення за замовчуванням для атрибута target у всіх посиланнях. Наприклад:
<base target="_blank">

Глобальні атрибути

Тег <base> підтримує всі глобальні атрибути HTML, хоча на практиці вони майже не застосовуються для цього елемента.

  • id — унікальний ідентифікатор. Наприклад:
<base id="mainBase" href="https://example.com/">
  • class — для CSS-стилізації вставленого екземпляра. Наприклад:
<base class="base-config" href="https://example.com/">

Приклад використання

<!DOCTYPE html>
<html lang="uk">
<head>
    <meta charset="UTF-8">
    <title>Приклад використання base</title>
    <base href="https://example.com/" target="_blank">
</head>
<body>
    <h2>Навігація:</h2>

    <p><a href="about.html">Про нас</a></p>
    <p><a href="contact.html">Контакти</a></p>
    <p><a href="blog/post-1.html">Блог</a></p>
</body>
</html>

У цьому прикладі всі посилання автоматично перетворюються на абсолютні:

  • https://example.com/about.html
  • https://example.com/contact.html
  • https://example.com/blog/post-1.html

Також, завдяки target="_blank", усі посилання відкриватимуться у новій вкладці.

Додаткові моменти

  • Тег <base> не має видимого відображення на сторінці.
  • Має вплив на всі відносні шляхи: зображення, посилання, скрипти, стилі.
  • Підтримується всіма сучасними браузерами.
  • Має бути лише один тег <base> на сторінці — якщо їх декілька, браузер врахує лише перший.
  • Особливо корисний при генерації HTML-шаблонів або роботи з підкаталогами.
  • Варто використовувати з обережністю, щоб уникнути неочікуваних змін у посиланнях.