Всегда ли <li>нужно вкладывать между <ul>и <ol>?не <nav>

Question

Я знаю, что этот вопрос задавался по-разному, в частности, с помощью «nav»

Но я продолжаю сталкиваться с веб-страницами, где «li» является дочерним по отношению к «section» или «article» без предшествующего »ul или 'ol' родительские элементы.Обычно это делается в параграфах.Это «правильный» метод?Если да, то какие другие элементы допустимо опускать 'ol' и 'ul'.

'section' 'li' lorem epsom carpe julgulerum '/ li'

(я знаю "правильно"может быть спорным, особенно если принять во внимание программы чтения с экрана)

Спасибо.

Answer 1

Страницы, где элементы li вложены непосредственно в элементы section, article или даже nav, явно имеют неверную разметку.Стандарты WHATWG и W3C (обе опубликованные и предстоящая версия) утверждают, что элементы li могут использоваться только в контексте элементов списка (либо ol или ul, стандарт WHATWG также добавляет опцию menu, в то время как стандарт W3C больше не имеет элемента menu).Нет других контекстов, в которых этот элемент можно использовать.

Однако, поскольку стандарт HTML разработан так, чтобы быть устойчивым к ошибкам и отказоустойчивым, он также имеет правила для браузеров, какиметь дело с неправильной разметкой.Вот почему определение элемента li имеет (довольно запутанную) часть «иначе», которая описывает, что должен делать браузер, если он встречает этот элемент в контексте, где он не может использоваться .Страница с такой неверной разметкой будет по-прежнему отображаться и в основном функциональна, но она будет не такой доступной, как страница с правильной разметкой (например, программы чтения с экрана не смогут объявить, что список существует и сколько элементов в нем содержится).

Элемент ul и ol, содержащий элементы li, может содержаться в любом элементе секционирования (и вообще в любом элементе, чья модель содержимого имеет значение "Поток"содержание ").Сами элементы li технически могут содержать любое «Содержимое потока» (включая разделы и заголовки), но в стандарте W3C содержится следующее примечание:

Хотя это соответствует включению элементов заголовка (например, h2) и Секционирование содержимого внутри элементов li, скорее всего, оно не передает семантику, намеченную автором.Заголовок начинает новый раздел, поэтому заголовок в списке неявно разделяет список на несколько разделов.Секционирование содержимого явно создает новый раздел и разбивает список на несколько разделов.

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

Answer 2

Если вы просто используете тег li без вложенности внутри тега ul или тега ol , полученным результатом будет неупорядоченный список со значками маркера, предшествующими тег li .Это не стандартный формат, хотя он дает точно такой же вывод, как вы используете его, вложенный в тег ol или тег ul .

Answer 3

Я не думаю, что это так же порезано и высушено, как MDN.В соответствии с WHATWG жизненным стандартом :

Контексты, в которых этот элемент может использоваться:

Внутри элементов ol.

Внутри элементов ul.

Внутри элементов меню.

Но затем в нем говорится:

Элемент li представляет элемент списка.Если его родительский элемент является элементом ol, ul или menu, то этот элемент является элементом списка родительского элемента, как определено для этих элементов. В противном случае , элемент списка не имеет определенного связанного со списком отношения с любым другим элементом li.

Что, по-видимому, говорит о том, что было бы правомерно иметь li, не содержащийся ни в одном изэти элементы.

Глядя на таблицу стилей агента пользователя в Chrome, кажется, что все "стили списка" содержатся в родительском элементе:

ul, menu, dir {
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
}

, а li - просто элемент сdisplay:list-item компонент:

li {
    display: list-item;
    text-align: -webkit-match-parent;
}

Таким образом, было бы правомерно использовать li вне списка, если вам требуется элемент с отображением list-item.Насколько это полезно вне списка, открыто для обсуждения.

---

Ваш другой вопрос:

'li' является родителем 'section' или 'article',Это правильно"?

Да, <li> может содержать любой другой HTML.Точно так же, как любой контейнер.

Answer 4

Согласно странице Mozilla Developer Network :

Элемент HTML <li> используется для представления элемента в списке.Он должен содержаться в родительском элементе: упорядоченный список (<ol>), неупорядоченный список (<ul>) или меню (<menu>).

Так что да, вам нужновложить любой элемент <li> в список или меню.Однако элемент <li> может содержать почти любой другой элемент внутри.И также да, <article> или <section> могут содержаться внутри <li>.