Чем же удобен тег base и где мы можем его использовать? Ответ на этот вопрос вы сможете получить в данной статье.
Итак, тег base обычно располагают в теге head и используют один раз в контексте данного документа пример:
<base href="https://site.com/img/" target="_blank">
Как видите это одинарный тег. И он может содержать такие атрибуты как target и href.
Причем его можно указать только один раз в контексте данного документа, если мы укажем так:
<base href="https://site.com/img/" target="_blank">
<base href="https://site2.com/img/" target="_blank">
Второй тег base будет проигнорирован.
При наличие атрибута href мы можем задавать полный путь при указании путей. Предположим я взял путь до директории иконок на сайте https://site.com если теперь в html коде я укажу:
<base href=" https://site.com/img/" >
<img src="1.jpg"/>
У нас подгрузится изображение по адресу https://site.com/img/1.jpg.
Однако тут следует понимать что все наши пути поменяются на https://site.com/img/ во всех атрибутах src и href имеющих относительные пути.
В результате все ссылки будут вести на адрес начинающийся с https://site.com/img/ и согласитесь это не совсем то что нам нужно.
Поэтому в атрибуте href тега base предпочтительнее указывать просто домен, так как он может содержаться во всех путях. За исключением путей(ссылок) на другие ресурсы.
<base href="https://webfanat.com" target="_blank">
<img src="/view/assets/img/logo.png"/>
<a href="">Главная</a>
<a href="https://youtube.com">Ссылка на youtube</a>
Наводя курсор на ссылку 'Главная' мы можем наблюдать что нам подсвечивается домен указанный в атрибуте href тега base.
Заметьте ссылка на youtube корректно работает. То есть пути начинающиеся с протокола(http или https) base игнорирует и оставляет без изменений. Помимо атрибута href тег base можем принимать атрибут target. Данный атрибут предназначен прежде всего для ссылок. Обычно он используется в ссылках.
Если к примеру мы укажем значение target="_blank":
<base href="https://webfanat.com" target="_blank">
то все ссылки имеющие относительный путь в контексте данного документа будут открываться в новой вкладке.
В общем вы можете использовать данный тег для преобразования относительных путей в полные.
На этом данная статья подошла концу.
Желаю удачи и успехов! Пока!