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

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

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

Теги на букву B:
<b>

Тег <b>


Тег <b> задаёт жирный шрифт и привлекает внимание к фрагменту текста. При этом важность текста роли не играет, в отличие от <strong>, который используется для выделения значимого фрагмента.

Тег <b> не предназначен для оформления текста. Для этого используют тег <span>, которому присваивают стили (в CSS — свойство font-weight).


Атрибуты

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


Пример

<p>Это неимоверно <b>жирный</b> кот!</p>

Результат

Это неимоверно жирный кот!



<base>

Тег <base>


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

Обычно он размещается в теге <head> и применяется к таким элементам, как <a>, <img>, <script> и <link>, которые используют относительные пути.


Атрибуты

АтрибутФункцияЗначение
hrefАдрес для указания полного пути к файлам.Путь к документу.
targetОпределяет где открывать ссылку._blank — загружает страницу в новой вкладке браузера;
_self — загружает страницу в текущую вкладку (по умолчанию);
_parent — загружает страницу в родительском окне, которое содержит фрейм;
_top — покидает фрейм и загружает страницу в полном окне браузера;
имя_фрейма — (заданное атрибутом name элемента <iframe>) открывает связанный документ в этом фрейме.

Пример

<head> 
  <base href="https://xx.com/blog/"> 
</head> 
<body> 
  <a href="article.html">..</a> 
  <!-- Получится: <a href="https://xx.com/blog/article.html">..</a> -->
   
  <img src="cover.jpg" alt=""> 
  <!-- Получится: <img src="https://xx.com/blog/cover.jpg" alt=""> --> 
</body>


<bdi>

Тег <bdi>


Тег <bdi> изолирует фрагмент текста от изменения направления вывода текста. Это актуально для текстов, одновременно включающих такие языки, которые читают и слева направо, и справа налево.


Атрибуты

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


Синтаксис

<bdi>текст</bdi>


<bdo>

Тег <bdo>


Тег <bdo> устанавливает направление вывода текста, что актуально для языков, которые читают справа налево, таких как иврит, арабский, персидский.


Атрибуты

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


Синтаксис

<bdo>текст</bdo>


<blockquote>

Тег <blockquote>


Тегом <blockquote> выделяют цитаты на странице, при этом такой текст выглядит как отдельный блок с отступами.

Для вставки небольшой цитаты прямо в строку текста используют тег <q>.


Атрибуты

АтрибутФункцияЗначение
citeУказывает на источник цитаты и не отображается на странице, предназначен для поисковых систем.Ссылка на источник или его название.

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


Пример

<blockquote cite="Иван Васильевич меняет профессию">
  <p>«Я должна сообщить тебе ужасное известие. У меня сегодня в кафе увели перчатки. И я полюбила другого!»</p>
</blockquote>

Результат

«Я должна сообщить тебе ужасное известие. У меня сегодня в кафе увели перчатки. И я полюбила другого!»



<body>

Тег <body>


Тег <body> — это тело страницы, в нём находится всё видимое содержимое. Один из основных структурных тегов HTML, наряду с <html> и <head>.


Атрибуты

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


Синтаксис

<!DOCTYPE html>
<html lang="ru">
  <head>
    <title>..</title>
    <meta charset="utf-8">
      <!-- Раздел для служебных тегов -->
  </head>
  <body>
      <!-- Всё что видно на странице -->
  </body>
</html>


<br>

Тег <br>


Тег <br> прерывает строку с того места, где он находится, и переносит на новую. У него нет закрывающего тега.


Атрибуты

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


Пример

<p>Быть можно дельным человеком<br> И думать о красе ногтей...</p>

Результат

Быть можно дельным человеком
И думать о красе ногтей...



<button>

Тег <button>


Тег <button> служит для создания кнопки, на которой можно разместить надпись, изображение. Этот тег часто используют в элементе <form>.


Атрибуты

АтрибутФункцияЗначение
disabledБлокирует кнопку, не позволяет навести на неё фокус.Атрибут без значения
formУстанавливает связь кнопки с формой.Одинаковое со значением атрибута id тега <form>.
formactionАдрес обработчика формы.Адрес программы.
formenctypeКодирование данных формы для отправки на сервер.application/x-www-form-urlencoded — символы кодируются шестнадцатеричными значениями, вместо пробелов символ + (по умолчанию);
multipart/form-data — данные передаются без кодирования;
text/plain — символы не кодируются, вместо пробелов символ +.
formmethodМетод пересылки данных формы.GET или POST.
formnovalidateОтменяет автоматическую проверку браузером данных формы на корректность.Атрибут без значения
formtargetГде откроется результат отправки формы._blank — загружает страницу в новой вкладке браузера;
_self — загружает страницу в текущую вкладку (по умолчанию);
_parent — загружает страницу в родительском окне, которое содержит фрейм;
_top — покидает фрейм и загружает страницу в полном окне браузера;
имя_фрейма — (заданное атрибутом name элемента <iframe>) открывает связанный документ в этом фрейме.
nameУникальное имя кнопки.Имя.
popovertargetСвязывает кнопку со всплывающим окном, позволяя при клике по кнопке открывать-закрывать окно.Имя идентификатора, заданного для элемента всплывающего окна.
popovertargetactionЗадаёт действие, которое выполняется со всплывающим окном, при клике по кнопке.hide — Скрывает всплывающее окно, если оно видимо;
show — Показывает всплывающее окно, если оно скрыто;
toggle — Позволяет переключать видимость-невидимость всплывающего окна (по умолчанию).
typeУстанавливает тип кнопки.button — обычная кнопка;
reset — кнопка для очистки данных формы и возвращения первоначальных значений;
submit — кнопка для отправки данных формы на сервер (по умолчанию);
menu — открывает меню, созданное с помощью тега <menu>.
valueЗначение кнопки для отправки на сервер.В паре "имя=значение", имя задаётся атрибутом name, а значение — атрибутом value. Значение не обязательно должно совпадать с текстом на кнопке.

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


Пример

                         
<form action="" method="get">
  <label>
    Текстовое поле:<br>
    <input type="text" size="40">
  </label>
  <button type="reset">Очистить</button>
  <button type="submit">Отправить</button>
</form>

Результат



Популярное

Полезное

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

Мы здесь

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

Вверх