Разве HTML5-теги не являются элементами блочного уровня?

Question

Если у меня есть элемент HTML <header> и я применяю некоторые поля к этому элементу HTML5 через CSS как:

header{
  margin:10px 0;
}

Элемент <header> не расположен на расстоянии 10 px от остальных элементов.Но если я изменю свое правило CSS, как показано ниже:

header{
  margin:10px 0;
  display:block;
}

, тогда элемент <header> будет соответственно разнесен.

Итак, мой вопрос здесь заключается в том, что мне нужно вручную установить display:block;, чтобы задать поля / отступы для элементов HTML5, например <header>?

PS: чтобы уточнить, этоне является частью производственного кода / живого сайта.Я просто экспериментирую с тегами HTML5.:)

Answer 1

Спецификация, кажется, перечисляет header в качестве элемента уровня блока, http://www.whatwg.org/specs/web-apps/2007-10-26/multipage/section-documents0.html#block-level0

Но поскольку HTML5 еще не завершен, понятно, что поставщики пользовательских агентов не делают их автоматически на уровне блоков.Таким образом, вы должны просто составить правило, устанавливающее те элементы html 5, которые определены спецификацией как блокированные, равными display:block;.

Answer 2

Чтобы позволить вам использовать элементы HTML 5 в старых браузерах, которые их не поддерживают, вы можете использовать скрипт Shiv от Реми Шарпа, который в основном «создает» эти элементы с использованием JavaScript.

http://remysharp.com/2009/01/07/html5-enabling-script/

И есть действительно полезный CSS Reset от Rich Clark, который включает элементы HTML 5:

http://html5doctor.com/html-5-reset-stylesheet/

Я использую HTML5 во многих своих проектах по разным причинам,прежде всего потому, что я люблю новые игрушки!(это также помогает уменьшить размер кода на небольшом уровне, и я предпочитаю более семантические элементы)

Answer 3

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

Я бы пока придерживался HTML 4.01.

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

В старых версиях IE вам нужно будет сделать что-то вроде document.createElement('header'), чтобы браузер даже распознал его для стилизации (и это не получится, если JS отключен).

Answer 4

Да.

По крайней мере, в текущей среде браузера.

Редактировать: Спецификация говорит, что "типичным значением по умолчанию" является блок, но, похоже, это не относится к текущим браузерам.