Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
4.0+ | 1.0+ | 4.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
HTML: | 3.2 | 4.01 | 5.0 | XHTML: | 1.0 | 1.1 |
Элемент <div> является блочным элементом и предназначен для выделения фрагмента документа с целью изменения вида содержимого. Как правило, вид блока управляется с помощью стилей. Чтобы не описывать каждый раз стиль внутри тега, можно выделить стиль во внешнюю таблицу стилей, а для тега добавить атрибут class или id с именем селектора.
Как и при использовании других блочных элементов, содержимое тега <div> всегда начинается с новой строки. После него также добавляется перенос строки.
<div>...</div>
Также для этого тега доступны универсальные атрибуты и события.
Обязателен.
Пример
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Тег DIV</title> <style type="text/css"> .block1 { width: 200px; background: #ccc; padding: 5px; padding-right: 20px; border: solid 1px black; float: left; } .block2 { width: 200px; background: #fc0; padding: 5px; border: solid 1px black; float: left; position: relative; top: 40px; left: -70px; } </style> </head> <body> <div class="block1">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.</div> <div class="block2">Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</div> </body> </html>
Результат данного примера показан на рис. 1.
Рис. 1. Вид блоков, оформленных с помощью стилей
Сайт