Справочник HTML на A

теги, атрибуты и их значения

☚ В начало | Справочник HTML

Теги на букву A:
<a>

Тег <a>


Тег <a> — отвечает за навигацию в HTML, с его помощью создают ссылки. В атрибуте href указывают адрес, куда пользователь перейдёт после клика по ссылке. Адрес ссылки может быть абсолютным (полным), который работает везде. Или относительным и работать только внутри сайта.

<a href="https://soolo.ru/spravochnik-html.html">Абсолютный адрес</a>
<a href="spravochnik-html.html">Относительный адрес</a>

Атрибут href умеет работать с разными типами адресов, это может быть документ PDF или RAR, почтовый клиент, или может предложить набрать номер телефона.

<a href="mailto:admin@soolo.ru">Почта</a>
<a href="tel:+790000000">Позвонить нам</a>


Якорь

Якорные ссылки позволяют перемещаться внутри страницы. Допустим, у вас длинная статья и вам надо, чтобы читатель по ссылке из раздела «Содержание» в начале страницы мог сразу перейти к нужному разделу. Вот тут и пригодится якорь.

Для создания якоря нужно назначить имя элементу, к которому будет переход. Для этого используем атрибут id:

<p id="section">...</p>

Теперь создаём ссылку на этот якорь, где значением атрибута href будет "#имя":

<a href="#section">Перейти к разделу</a>


Атрибуты

АтрибутФункцияЗначение
downloadПредлагает скачать файл.Если атрибут написать без значения, то файл сохранится с исходным именем. В качестве значения можно указать рекомендуемое имя файла.
hrefАдрес документа, на который ведёт ссылка.URL
hreflangИдентифицирует язык текста по ссылке.Код языка. Например: ru или en.
pingУказывает адрес, куда браузер, при переходе по ссылке, отправляет POST-запрос, содержащий адрес ссылки, данные браузера и др.URL
referrerpolicyОпределяет реферальные данные, которые нужно отправить при переходе по ссылке в заголовке Referer.no-referrer — заголовок Referer не отправляется;

Открыть все значения…no-referrer-when-downgrade — заголовок Referer не отправляется при переходе с HTTPS на HTTP;
same-origin — данные отправляются в пределах одного сайта, и не передаются при переходе на другой сайт;
origin — данные ограничены и включают только протокол, адрес сайта и порт, если он указан;
strict-origin — данные включают протокол, адрес сайта и порт, если он указан. Данные передаются только в рамках одного и того же протокола и не отправляются при переходе с HTTPS на HTTP;
origin-when-cross-origin — передаётся полный путь в рамках одного сайта. При переходе на другой сайт данные ограничены и включают только протокол, адрес сайта и порт;
strict-origin-when-cross-origin — передаёт полный путь в рамках одного сайта. При переходе на другой сайт передаётся протокол, адрес сайта и порт, но только когда протокол остаётся прежним. Заголовок не передаётся при переходе с HTTPS на HTTP;
unsafe-url — передаёт полный адрес документа, что считается небезопасным.
relСвязь между текущим документом и документом, на который ведёт ссылка.alternate — Ссылка на альтернативные представления текущего документа.

Открыть все значения…author — Ссылка на автора текущего документа или статьи.
bookmark — Постоянная ссылка на ближайший родительский раздел.
external — Документ, на который ведёт ссылка, не является частью данного сайта.
help — Ссылка на контекстно-зависимую справку.
license — Ссылка на лицензию, по которой распространяется содержимое документа.
next — Текущий документ является частью серии и ссылка ведёт на следующий документ в серии.
nofollow — Говорит поисковым системам не учитывать эту ссылку при ранжировании сайтов.
noopener — Блокирует доступ новой вкладке к вашей странице. Это защита от потенциальных атак.
noreferrer — Cкрывает адрес вашей страницы от сайта, на который ведёт ссылка.
opener — Открывает доступ новой вкладке к вашей странице.
prev — Текущий документ является частью серии и ссылка ведёт на предыдущий документ в серии.
privacy-policy — Ссылка на информацию о методах сбора и использования данных, применяемых к текущему документу.
search — Ссылка на ресурс, который можно использовать для поиска по текущему документу и связанных с ним страниц.
tag — Устанавливает тег (идентифицируемый по указанному адресу), который применяется к текущему документу.
terms-of-service — Ссылка на информацию о соглашениях между поставщиком текущего документа и пользователями, желающими его использовать.
targetОпределяет где открывать ссылку: в новой вкладке, в текущей или во фрейме._blank — загружает страницу в новой вкладке браузера;
_self — загружает страницу в текущую вкладку (по умолчанию);
_parent — загружает страницу в родительском окне, которое содержит фрейм;
_top — покидает фрейм и загружает страницу в полном окне браузера;
имя_фрейма — (заданное атрибутом name элемента <iframe>) открывает связанный документ в этом фрейме.
typeMIME-тип документа, на который ведёт ссылка.MIME-типы

Для элемента доступны глобальные атрибуты.


Пример

<a href="osnovy-verstka-html.html" target="_blank">Основы вёрстки HTML</a>

Результат

Ссылка откроется в новой вкладке браузера:

Основы вёрстки HTML


<abbr>

Тег <abbr>


Тег <abbr> указывает, что его содержимое является аббревиатурой. Атрибут title даёт всплывающую подсказку с расшифровкой сокращения людям, которые с ней не знакомы, а поисковые системы вдобавок индексируют полный вариант сокращения.


Атрибуты

Для элемента доступны глобальные атрибуты.


Синтаксис

<abbr title="Российская Федерация">РФ</abbr>


<address>

Тег <address>


Тег <address> предназначен для хранения контактной информации об авторе, людях или организации. Он может содержать адрес, телефон, email, сайт и т.п. Поисковые системы используют его содержимое для сбора информации об авторах.

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

Если <address> расположен внутри <article>, то контактная информация относится к автору статьи, а если нет, то ко всей странице. По умолчанию текст внутри <address> отображается курсивом.

Внутри <address> нельзя использовать заголовки <H1..H6> и все структурные элементы: <header>, <footer>, <article>, <aside> и др.


Атрибуты

Для элемента доступны глобальные атрибуты.


Пример

<p>Наши контакты:</p> 
<address>
    Москва, Большая Садовая, 302-бис, кв. 50 
    Писать до востребования.
</address>

Результат

Наши контакты:

Москва, Большая Садовая, 302-бис, кв. 50
Писать до востребования.


<area>

Тег <area>


Тег <area> определяет активные области изображения в качестве ссылок. В нём задают форму области, её размеры, указывают адрес документа, на которую ведёт ссылка. Картинка с несколькими активными областями — это карта-изображение.

Тег <area> всегда располагается в контейнере <map>, который связывает активные области с изображением.


Атрибуты

АтрибутФункцияЗначение
altАльтернативный текст для области изображения.Текст
coordsКоординаты активной области.Отсчёт координат ведётся от верхнего левого угла (ВЛУ) изображения в пикселях.

Для shape="rect" — определяются 4 координаты "X1, Y1, X2, Y2".
X1 — это расстояние от ВЛУ изображения до ВЛУ прямоугольника по оси X.
Y1 — расстояние от ВЛУ изображения до ВЛУ прямоугольника по оси Y.
X2 — расстояние от ВЛУ изображения до нижнего правого угла прямоугольника по оси X.
Y2 — расстояние от ВЛУ изображения до нижнего правого угла прямоугольника по оси Y.

Для shape="circle" — указывают 3 координаты: координаты центра окружности и её радиус "X, Y, R".

Для shape="poly" — последовательно указываются координаты каждой вершины многоугольника "X1, Y1, X2, Y2,…, Xn, Yn".
downloadПредлагает скачать файл.Если атрибут написать без значения, то файл сохранится с исходным именем. В качестве значения можно указать рекомендуемое имя файла.
hrefАдрес документа, на который ведёт ссылка.URL
pingУказывает адрес, куда браузер, при переходе по ссылке, отправляет POST-запрос, содержащий адрес ссылки, данные браузера и др.URL
referrerpolicyОпределяет реферальные данные, которые нужно отправить при переходе по ссылке в заголовке Referer.no-referrer — заголовок Referer не отправляется;
no-referrer-when-downgrade — заголовок Referer не отправляется при переходе с HTTPS на HTTP;

Открыть все значения…same-origin — данные отправляются в пределах одного сайта, и не передаются при переходе на другой сайт;
origin — данные ограничены и включают только протокол, адрес сайта и порт, если он указан;
strict-origin — данные включают протокол, адрес сайта и порт, если он указан. Данные передаются только в рамках одного и того же протокола и не отправляются при переходе с HTTPS на HTTP;
origin-when-cross-origin — передаётся полный путь в рамках одного сайта. При переходе на другой сайт данные ограничены и включают только протокол, адрес сайта и порт;
strict-origin-when-cross-origin — передаёт полный путь в рамках одного сайта. При переходе на другой сайт передаётся протокол, адрес сайта и порт, но только когда протокол остаётся прежним. Заголовок не передаётся при переходе с HTTPS на HTTP;
unsafe-url — передаёт полный адрес документа, что считается небезопасным.
shapeФорма области.circle — окружность;
default — вся область;
poly — полигон;
rect — прямоугольник.
targetОпределяет где открывать ссылку._blank — загружает страницу в новой вкладке браузера;
_self — загружает страницу в текущую вкладку (по умолчанию);
_parent — загружает страницу в родительском окне, которое содержит фрейм;
_top — покидает фрейм и загружает страницу в полном окне браузера;
имя_фрейма — (заданное атрибутом name элемента <iframe>) открывает связанный документ в этом фрейме.

Для элемента доступны глобальные атрибуты.


Синтаксис

<map>
  <area coords="200, 250, 420, 670" shape="rect" href="адрес">
</map>


<article>

Тег <article>


Тегом <article> выделяют самодостаточные блоки веб-страницы, завершённые по смыслу и независимые от основного контента, такие как статьи, новости, публикации в блоге или на форуме. У такого блока должен быть заголовок, текст, и он может содержать имя автора, дату и др.

Тег <article> — это семантический элемент, который делает структуру страницы более понятной поисковым роботам. Иногда его путают с другими семантическими элементами HTML5, вместо <article> используют <section>, или наоборот.

Если блок — часть целого и зависит от окружающего контента, это <section>. Если его можно вырезать и опубликовать отдельно — это <article>. Он может размещаться внутри <main>, но не наоборот.


Атрибуты

Для элемента доступны глобальные атрибуты.


Синтаксис

<article>
  <h2>Заголовок</h2>
  <p>Текст статьи</p>
</article>


<aside>

Тег <aside>


Тегом <aside> выделяют блоки веб-страницы, которые имеют косвенное отношение к содержимому страницы. Этот тег используют для боковых панелей, рекламных блоков и другой информации, не связанной с содержимым самой страницы.


Атрибуты

Для элемента доступны глобальные атрибуты.


Синтаксис

<aside>..</aside>


<audio>

Тег <audio>


Тег <audio> добавляет воспроизведение аудиозаписи на веб-странице. Путь к файлу задаётся через атрибут src. Внутри контейнера <audio> можно написать текст, который будет выводиться в браузерах, не работающих с данным форматом аудиофайла.

Для универсального воспроизведения в различных браузерах аудио кодируют с помощью нескольких кодеков (MP3, AAC, WAV) и добавляют файлы одновременно через элемент <source>.


Атрибуты

АтрибутФункцияЗначение
autoplayАвтоматическое воспроизведение аудио после загрузки страницы.Атрибут без значения
controlsДобавляет панель управления к аудиофайлу.Атрибут без значения
crossoriginЯвляется частью технологии CORS и применяется при загрузке аудио со стороннего сайта для использования в элементе <canvas>.anonymous — запрос к серверу без учётной записи пользователя;
use-credentials — запрос включает все учётные данные пользователя: куки браузера, сертификат X.509, логин, пароль и запрос на авторизацию.
loopЦиклическое воспроизведение.Атрибут без значения
mutedОтключает звук при воспроизведении музыки.Атрибут без значения
preloadИспользуется для предварительной загрузки аудиофайла или его данных вместе с загрузкой веб-страницы. Игнорируется, если установлен атрибут autoplay.none — не загружать (по умолчанию);
metadata — загрузить только метаданные об аудио;
auto — загружать.
srcУказывает путь к аудиофайлу, но предпочтительнее использовать <source>.URL

Для элемента доступны глобальные атрибуты.


Пример

<audio controls>
    <source src="primer/music.mp3">
    Не поддерживается вашим браузером. 
</audio>

Результат



Популярное

Полезное

Получить книгу

Мы здесь

Поделиться материалом с друзьями:

Вверх