Блог веб разработки статьи | видеообзоры | исходный код

Блог веб разработки статьи | видеообзоры | исходный код

webfanat вконтакте webfanat youtube

base html

base  html

Чем же удобен тег 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">

то все ссылки имеющие относительный путь в контексте данного документа будут открываться в новой вкладке.

В общем вы можете использовать данный тег для преобразования относительных путей в полные.

На этом данная статья подошла концу.

Желаю удачи и успехов! Пока!

Оцените статью:

Статьи

Разработки

Комментарии

В данном разделе пока нет комментариев!

Реклама

Запись экрана

Данное расширение позволяет записывать экран и выводит видео в формате webm