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

Question

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

И почему этот 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> 

визуализируется как это:

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

Answer 1

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

Для получения списка допустимых тегов самозакрывающиеся, см:

What are all the valid self-closing elements in XHTML (as implemented by the major browsers)?

Answer 2

Поскольку браузеры (как правило) не поддерживают самостоятельное закрытие тегов 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> 

Для получения более подробной информации см: Can a span be closed using <span />?

Answer 3

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

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

Спецификация поэтому defines a list как требуется хотя бы один элемент списка.

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

Что касается вашего второго вопроса, то в HTML Совместимый XHTML only elements which are defined as being EMPTY (то есть те, в которых конечный тег запрещенный в HTML) может (и должен) использовать самозакрывающихся синтаксис тэга.