Пустой UL внутри элемента LI - PullRequest
Новая
       12

Пустой UL внутри элемента LI

3 голосов
/ 20 мая 2010

Может кто-нибудь объяснить мне, почему <ul> элемент не может быть пустым?

А почему этот HTML: 

<ul>
    <li class="header">
        <a href="#">Work</a>
        <ul/>
    </li>
    <li class="header">
        <a href="#">New</a>
        <ul/>
    </li>
    <li class="header">
        <a href="#">Ungrouped</a>
        <ul/>
    </li>
    <li class="header">
        <a href="#">Offline</a>
        <ul/>
    </li>
</ul>

отображается так:

  • Работа
    • Новый
      • разгруппирована
        • Offline

Ответы [ 3 ]

7 голосов
/ 20 мая 2010

<ul> не является допустимым самозакрывающимся тегом, поэтому браузеры могут рассматривать его, как если бы он не был закрыт надлежащим образом. Вы всегда должны использовать закрывающий тег </ul>.

Список допустимых самозакрывающихся тегов см .:

Каковы все допустимые самозакрывающиеся элементы в XHTML (как реализовано основными браузерами)?

3 голосов
/ 20 мая 2010

Что за звук хлопка одной рукой?

Список с нулевыми элементами не имеет смысла с точки зрения документа, а HTML является языком разметки документа.

Спецификация поэтому определяет список как требующий по крайней мере один элемент списка в нем. 

<!ELEMENT UL - - (LI)+                 -- unordered list -->

Что касается вашего второго вопроса, в HTML-совместимом XHTML только элементы, которые определены как ПУСТОЙ (то есть те, в которых конечный тег запрещен в HTML), могут (и должны) использовать самозакрывающийся тег синтаксис.

1 голос
/ 20 мая 2010

Поскольку браузеры (обычно) не поддерживают самозакрывающиеся теги в стиле XML. Это будет работать: 

<ul>
    <li class="header">
        <a href="#">Work</a>
        <ul></ul>
    </li>
    <li class="header">
        <a href="#">New</a>
        <ul></ul>
    </li>
    <li class="header">
        <a href="#">Ungrouped</a>
        <ul></ul>
    </li>
    <li class="header">
        <a href="#">Offline</a>
        <ul></ul>
    </li>
</ul>

Подробнее см .: Можно ли закрыть интервал с помощью <span />?

...