Html тег внизу страницы

HTML Tag

The tag defines a footer for a document or section.

A element typically contains:

  • authorship information
  • copyright information
  • contact information
  • sitemap
  • back to top links
  • related documents

You can have several elements in one document.

Tips and Notes

Tip: Contact information inside a element should go inside an tag.

Browser Support

The numbers in the table specify the first browser version that fully supports the element.

Element
5.0 9.0 4.0 5.0 11.1

Global Attributes

Event Attributes

More Examples

Example

Default CSS Settings

Most browsers will display the element with the following default values:

Unlock Full Access 50% off

COLOR PICKER

colorpicker

Join our Bootcamp!

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials
Top References
Top Examples
Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

HTML тег

Тег выделяет нижний колонтитул (“подвал”) веб-сайта или раздела. Как правило, в нем размещается информация об авторских правах, контактные данные, ссылки для навигации и т.д.

В пределах одной страницы можно разместить несколько тегов . К примеру, можно разместить нижний колонтитул внутри тега для хранения относящейся к статье информации (ссылки, сноски, и т.д.).

В нем могут содержаться другие HTML элементы, кроме тегов и .

Тег недавно вошел в спецификацию HTML 5, он поддерживается всеми браузерами.

Синтаксис

Содержимое тега пишется между открывающим (

) и закрывающим (

) тегами.

Пример

html> html> head> title>Заголовок документа title> style> .header < height: 40px; padding: 20px 20px 0; background: #e1e1e1; > .main-content < height: 60vh; padding: 20px; > footer < padding: 10px 20px; background: #666; color: white; > a < color: #00aaff; > style> head> body> div class="header">Заголовок / Меню div> div class="main-content"> h1>Основной контент h1> p>Это какой-то параграф. p> div> footer> p>Компания © W3docs. Все права защищены. p> footer> body> html>

Результат

footerexample1

Атрибуты

Как добавить стиль к тегу ?

Распространенные свойства для изменения визуальной насыщенности/выделения/размера текста внутри тега :

  • CSS свойство font-style задает стиль шрифта: normal | italic | oblique | initial | inherit
  • CSS свойство font-family создает приоритетный список названий семейства шрифтов и/или общее имя шрифтов для выбранных элементов.
  • CSS свойство font-size задает размер щрифта.
  • CSS свойство font-weight устанавливает насыщенность шрифта.
  • CSS свойство text-transform задает регистр текста (заглавные или строчные буквы).
  • CSS свойство text-decoration устанавливает оформление текста. Оно является сокращенным свойством для text-decoration-line, text-decoration-color, text-decoration-style.

Цвет текста внутри тега :

Стили форматирования текста для тега :

  • CSS свойство text-indent указывает размер отступа первой строки в текстовом блоке.
  • CSS свойство text-overflow указывает, как будет отображаться пользователю строчный текст, выходящий за границы блока.
  • CSS свойство white-space указывает, как будут отображены пробелы внутри элемента.
  • CSS свойство word-break указывает перенос строки.

Другие свойства для тега :

  • CSS свойство text-shadow добавляет тень к тексту.
  • CSS свойство text-align-last выравнивает последнюю строку текста.
  • CSS свойство line-height устанавливает межстрочный интервал.
  • CSS свойство letter-spacing устанавливает расстояние между буквами/символами в тексте.
  • CSS свойство word-spacing устанавливает расстояние между словами в тексте.

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

Источник

Html тег внизу страницы

HTML-элемент представляет собой нижний колонтитул (футер, подвал) для своего ближайшего секционного контента или секционного корня. Футер обычно содержит информацию об авторе раздела, информацию об авторском праве или ссылки на связанные документы.

Интерактивный пример

Категории контента Основной поток, явный контент.
Допустимое содержимое Контент основного потока, кроме и .
Пропуск тегов Нет, открывающий и закрывающий теги обязательны.
Допустимые родители Любой элемент, который разрешает Контент основного потока в качестве содержимого. Обратите внимание, что элемент не должен быть потомком элемента , или другого элемента .
Допустимые ARIA-роли group (en-US) , presentation (en-US)
DOM-интерфейс HTMLElement

Атрибуты

К этому элементу применимы только глобальные атрибуты.

Примечание

Примеры

footer> Какая-то информация об авторском праве или может информация об авторе статьи? footer> 

Проблемы доступности

У программа чтения с экрана VoiceOver есть проблема, при которой она не читает элемент (не добавляет роль-ориентир элемента в список ориентиров). Чтобы решить эту проблему добавьте role=»contentinfo» в элемент .

Спецификации

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

BCD tables only load in the browser

Смотрите также

Found a content problem with this page?

This page was last modified on 4 мар. 2023 г. by MDN contributors.

Your blueprint for a better internet.

Источник

Html тег внизу страницы

Время чтения: меньше 5 мин

Обновлено 26 октября 2022

Кратко

Скопировать ссылку «Кратко» Скопировано

создаёт нижнюю часть страницы или блока — «подвал». Обычно здесь находятся контакты, ссылки на разделы сайта, копирайт.

Пример

Скопировать ссылку «Пример» Скопировано

В нашем блоке со статьёй будет небольшой футер с указанием автора и его контактами:

   

Бигфут

Бигфут (от англ. Bigfoot, «большеногий») — название полумифического млекопитающего.

Ольга Сасквоч

Почта: sasquatch@yandex.ru.

article> h1>Бигфутh1> p>Бигфут (от англ. Bigfoot, «большеногий») — название полумифического млекопитающего. p> footer> p>Ольга Сасквочp> p>Почта: a href="mailto:sasquatch@yandex.ru">sasquatch@yandex.rua>.p> footer> article>

Как понять

Скопировать ссылку «Как понять» Скопировано

Как правило, у сайта есть «шапка» и «подвал»: верхняя и нижняя части страницы. Обычно эти блоки выглядят одинаково на всех страницах. Эти разделы помогают пользователю сориентироваться и получить основную инфу о сайте.

В подвале мы чаще всего видим название компании, правовую информацию, ссылки на соцсети и другие контакты.

может быть не только у всего сайта целиком, но и у отдельного блока или секции.

Как пишется

Скопировать ссылку «Как пишется» Скопировано

Тег парный, должен всегда закрываться < / footer>.

Атрибуты

Скопировать ссылку «Атрибуты» Скопировано

Подсказки

Скопировать ссылку «Подсказки» Скопировано

💡 У блочные стили по умолчанию 🤓

💡 Контакты и информацию об авторе стоит поместить в контейнер , а его добавить в .

На практике

Скопировать ссылку «На практике» Скопировано

Дока Дог советует

Скопировать ссылку «Дока Дог советует» Скопировано

🛠 У особо нет никаких хитростей. Это нижняя часть страницы: там располагаются разные эпилоги. Если это лендинг, там могут лежать иконки соцсетей и информация о компании. Важно выделить , чтобы поисковик понял, что находится в этом блоке.

Источник

Html тег внизу страницы

Тег используется для создания подвала сайта. В этом подвале обычно содержатся копирайт, контактная информация, ссылки на социальные сети, меню и другая вспомогательная информация.

 

© HTML Academy, 2023. Все права защищены.

Атрибуты тега :

  • id — уникальный идентификатор элемента.
  • class — определяет имя класса, которое позволяет связать тег со стилевым оформлением.

Примеры использования

Подвал с меню и контактной информацией:

Подвал со ссылками на социальные сети:

Для чего использовать тег

  • Разместить копирайт и авторские права.
  • Отобразить контактную информацию.
  • Разместить дополнительное меню навигации.
  • Добавить ссылки на социальные сети.
  • Показать ссылки на политику конфиденциальности и пользовательское соглашение.
  • Разместить логотип и ссылку на главную страницу.
  • Отобразить информацию о партнёрах и спонсорах.

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

Ограничения

Нюансы

Чем заменить тег

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

👉🏻 Другие теги для структурирования контента

«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.

Источник

Читайте также:  Php array order by key value
Оцените статью