Странный html5 набросок документа

Я прочитал несколько статей по алгоритму html5, но это меня сбивает с толку.Странный html5 набросок документа

Если вставить следующую разметку в этот инструмент: http://gsnedders.html5.org/outliner/

<body> 
    <nav> 
     <h1>Navigation</h1> 
     <ul> 
      <li>...</li> 
     </ul> 
    </nav> 
    <h1>My fantastic site</h1> 
    <h2>About me</h2> 
    <p>I am a man who lives a fascinating life. Oh the stories I could tell you...</p> 
    <h2>What I do for a living</h2> 
    <p>I sell enterprise-managed ant farms.</p> 
    <h1>Contact</h1> 
    <p>Shout my name and I will come to you.</p> 
</body>

вы получите такую схему:

Мой фантастический сайт
1. Навигация
2. Обо мне
3. Что я буду делать для себя
Контакт

Это довольно просто. Навигация является подкатегорией <body>, поэтому отображается ниже <body>'s <h1>, как и все заголовки уровня h2.

Но посмотрите на следующий пример:

<body> 
    <nav> 
     <h1>Navigation</h1> 
     <ul> 
      <li>...</li> 
     </ul> 
    </nav> 
    <h1>My fantastic site</h1> 
    <figure><img src="" alt="" /><figure> 
    <h2>About me</h2> 
    <p>I am a man who lives a fascinating life. Oh the stories I could tell you...</p> 
    <h2>What I do for a living</h2> 
    <p>I sell enterprise-managed ant farms.</p> 
    <h1>Contact</h1> 
    <p>Shout my name and I will come to you.</p> 
</body>

Я добавил <figure> элемент между <h1> и <h2> и это, кажется, влияют на схему в соответствии с http://gsnedders.html5.org/outliner/.

Выход из Структуризаторе:

Мой фантастический сайт
1. Навигация
  1. Обо мне
  2. Что я могу сделать для жизни
Контакты

Все заголовки уровня h2 теперь являются потомками <nav> вместо <body>. Может ли кто-нибудь объяснить, почему это происходит? Это какая-то ошибка в инструменте outliner?

Thanks

источник

2013-07-03 Kuwiuwuw Kurwiow

Это похоже на ошибку.

Это, кажется, происходит, как только вы используете sectioning root элемент (, details, dialog, fieldset, figure) непосредственно после body «s h1.

Если я размещаю корневой элемент секционирования до h1, outliner выдает ошибку (<type 'exceptions.AttributeError'>). Я использовал этот документ:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Test</title> 
</head> 
<body> 

    <nav></nav> 

    <blockquote></blockquote> 

    <h1>My fantastic site</h1> 

    <h2>About me</h2> 

</body> 
</html>

источник

2013-07-06 17:55:43 unor

Это явно ошибка с этим сайтом. Кроме того, ваш тег закрытия figure неверен и должен быть только h1 на странице.

Попробуйте протестировать это на JSFiddle.net, и вы увидите, что он работает так, как ожидалось. Кроме того, W3C Validator - хорошее место, чтобы проверить ваш HTML5.

источник

2013-07-03 13:59:45

Да, кажется, это ошибка. Закрытие '

' не помогает. –

H1 может быть столько раз в HTML5. –

Для ориентированных на SEO, теги H1 следует использовать один раз на странице. Извините за отсутствие разъяснений. –

Основная проблема заключается в том, что ваш закрывающий знак тега забыт с вами. Из-за этой проблемы с субтитрами упомянутый сайт для создания контура, рассмотрим все следующие элементы после элемента фигуры как подмножества элемента фигуры. Это означает, что элемент фигуры становится их участником. Теперь из-за этого вычитания на этом сайте все содержимое вашего документа после фигурного элемента консистенции в качестве содержимого элемента «Корневой раздел» (blockquote, body, details, dialog, fieldset, figure). Как я уверен, вы знаете, что разделы и заголовки внутри этих элементов не вносят свой вклад в очертания их предков. Заголовки в элементе «Корневой раздел» не будут включены в основной документ. Это означает, что вы можете иметь сложную иерархию заголовков в блочном запросе, не беспокоясь о том, как это повлияет на общую структуру документа.

Чтобы убедиться, что об этом ответе, пожалуйста, тест следующий фрагмент кода HTML, вы увидите тот же результат:

<body> 
    <nav> 
     <h1>Navigation</h1> 
     <ul> 
      <li>...</li> 
     </ul> 
    </nav> 
    <h1>My fantastic site</h1> 
    <figure> 
     <img src="" alt="" /> 
     <h2>About me</h2> 
     <p>I am a man who lives a fascinating life. Oh the stories I could tell you...</p> 
     <h2>What I do for a living</h2> 
     <p>I sell enterprise-managed ant farms.</p> 
     <h1>Contact</h1> 
     <p>Shout my name and I will come to you.</p> 
    </figure> 
</body>

, но я думаю, что это то, что вы whanted:

<body> 
    <nav> 
     <h1>Navigation</h1> 
     <ul> 
      <li>...</li> 
     </ul> 
    </nav> 
    <h1>My fantastic site</h1> 
    <figure> 
     <img src="" alt="" /> 
    </figure> 
    <h2>About me</h2> 
    <p>I am a man who lives a fascinating life. Oh the stories I could tell you...</p> 
    <h2>What I do for a living</h2> 
    <p>I sell enterprise-managed ant farms.</p> 
    <h1>Contact</h1> 
    <p>Shout my name and I will come to you.</p>  
</body>

источник

2017-08-13 15:34:24 MMKarami

ответ

Смежные вопросы