ЛУЧШИЙ САЙТ ДЛЯ ВЕБ-РАЗРАБОТЧИКОВ

HTML Справочник

HTML Теги по алфавиту HTML Теги по категории HTML Поддержка браузеров HTML Атрибуты HTML Глобальные атрибуты HTML Атрибуты событий HTML Цвета HTML Canvas HTML Аудио/Видео HTML Наборы символов HTML Doctype HTML URL кодирование HTML Коды языков HTML Коды стран HTTP Сообщения HTTP Методы PX в EM Конвертер Горячие клавиши


HTML5. W3Schools на русском. Полный справочник тегов

Ua En Es De Fr

HTML Тег <footer>


Пример

Раздел нижнего колонтитула (футера) в документе:

<footer>
  <p>Author: Hege Refsnes</p>
  <p><a href="mailto:hege@example.com">hege@example.com</a></p>
</footer>
Попробуйте сами »

Больше примеров "Попробуйте сами" далее.


Определение и использование

Тег <footer> определяет нижний колонтитул для документа или раздела.

Элемент <footer> обычно содержит:

  • информация об авторстве
  • информация об авторських правах
  • контактная информация
  • карта сайта
  • ссылки на начало списка
  • связанные документы

Вы можете иметь несколько элементов <footer> в одном документе.


Советы и примечания

Совет: Контактная информация внутри элемента <footer> должна находиться внутри тега <address>.


Поддержка браузерами

Числа в таблице указывают на первую версию браузера, которая полностью поддерживает элемент.

Элемент
<footer> 5.0 9.0 4.0 5.0 11.1

Глобальные атрибуты

Тег <footer> также поддерживает Глобальные атрибуты в HTML.


Атрибуты событий

Тег <footer> также поддерживает Атрибуты событий в HTML.


Больше примеров

Пример

Используйте CSS для стилизации элемента <footer>:

<html>
<head>
<style>
footer {
  text-align: center;
  padding: 3px;
  background-color: DarkSalmon;
  color: white;
}
</style>
</head>
<body>

<footer>
  <p>Author: Hege Refsnes<br>
  <a href="mailto:hege@example.com">hege@example.com</a></p>
</footer>

</body>
</html>
Попробуйте сами »

Связанные страницы

HTML DOM справочник: Объект Footer


CSS настройки по умолчанию

Большинство браузеров будут отображать элемент <footer> со следующими значениями по умолчанию:

footer {
  display: block;
}