Справочники HTML5 div

Что такое div в HTML5?

HTML тег <div> используется для создания блоков на сайте. Эти блоки могут отвечать за любые объекты на сайте: шапка, новость, футер, какая-либо панель и так далее. Все эти блоки можно с легкостью подстроить под свои нужды при помощи CSS. Требует закрывающий тег </div>.

Если использовать тег сам по себе без использования стилей, то вы не заметите никаких изменений в документе.

Атрибуты:

align - указывает каким образом будет расположен текст и все содержимое в блоке;
class - добавляет класс к объекту для добавления стилей к нему;
id - указывается идентификатор объекта, по которому можно обращаться к объекту;
title - добавляет подсказку при наведении и удержании мыши на любую точку блока.

CSS код для стилизации наших блоков:

#block-1 {
	float: left;
	width: 50%;
	background-color: #e4a7a7;
	margin-left: 25%;
	padding: 20px;
	box-sizing: padding-box;
	color: #fff;
}

#block-1>div {
	float: left;
	width: 100%;
	margin-top: 10px;
	text-align: center;
	background-color: #59b7c1;
}

HTML код создания блоков на сайте:

<div id="block-1">
	Это обычный блок на сайте.<br>
	Здесь есть теги - <em>курсир</em>, <b>жирный шрифт</b> и так далее.
	Также здесь могут быть другие блоки:
	<div>
		Какой-то текст здесь.
	</div>
</div>

Результат:

Это обычный блок на сайте.
Здесь есть теги - курсир, жирный шрифт и так далее. Также здесь могут быть другие блоки:

Какой-то текст здесь.

Комментарии