2012-02-25 2 views
6

Я новичок и запустил мой код через html validator.неупорядоченный список навигации html structure

Что касается моей навигации я получаю сообщение, что гласит:: Элемент уль не допускается в качестве дочернего элемента ул в этом контексте»

Вот HTML-структура:

<nav> 
<div class="nav_container"> 
<ul class="navigation"> 

<ul class="logo"> 
    <li><a href="index.htm"><img src="images/rh_logo_v5.png" alt="roundhaus logo"/></a></li> 
</ul> 
<ul class="subnav"> 
    <li><a href="index.htm">home</a></li> 
    </ul> 
<ul class="subnav"> 
    <li><a href="reclaimedwood.htm">reclaimed wood</a></li> 
     <li><a href="design.htm">design</a></li> 
    </ul> 
    <ul class="subnav"> 
    <li><a href="flooring.htm">flooring</a></li> 
    <li><a href="paneling.htm">paneling</a></li> 
    <li><a href="beams.htm">beams</a></li> 
</ul> 
<ul class="subnav"> 
    <li><a href="shelving.htm">shelving</a> 
    </li><li><a href="mantels.htm">mantels</a></li> 
</ul> 
<ul class="subnav"> 
    <li><a href="news.htm">news</a></li> 
</ul> 
<ul class="subnav"> 
    <li><a href="woodtypes.htm">wood types</a></li> 
    <li><a href="phrases.htm">phrases</a></li> 
</ul> 

</ul> 
</div> 
</nav> 

Что случилось с ним? Он выглядит хорошо во всех браузерах. должен ли я быть обеспокоены или принимать меры?

+0

Оберните внутренние неупорядоченные списки внутри тегов 'li'. Редактировать: Ярон избил меня. –

ответ

8

уль не может быть прямым потомком другого ул, она должна содержаться внутри литий

<ul class="navigation"> 
    <li> 
    <ul class="logo"> 
     <li><a href="index.htm"><img src="images/rh_logo_v5.png" alt="roundhaus logo"/></a></li> 
    </ul> 
    </li> 
    <li> 
    <ul class="subnav"> 
     <li><a href="index.htm">home</a></li> 
    </ul> 
    </li> 
    <li> 
    <ul class="subnav"> 
     <li><a href="reclaimedwood.htm">reclaimed wood</a></li> 
     <li><a href="design.htm">design</a></li> 
    </ul> 
    </li> 
    <li> 
    <ul class="subnav"> 
     <li><a href="flooring.htm">flooring</a></li> 
     <li><a href="paneling.htm">paneling</a></li> 
     <li><a href="beams.htm">beams</a></li> 
    </ul> 
    </li> 
    <li> 
    <ul class="subnav"> 
     <li><a href="shelving.htm">shelving</a></li> 
     <li><a href="mantels.htm">mantels</a></li> 
    </ul> 
    </li> 
    <li> 
    <ul class="subnav"> 
     <li><a href="news.htm">news</a></li> 
    </ul> 
    </li> 
    <li> 
    <ul class="subnav"> 
     <li><a href="woodtypes.htm">wood types</a></li> 
     <li><a href="phrases.htm">phrases</a></li> 
    </ul> 
    </li> 
</ul> 

вы могли бы также дать МЕНЮ некоторые заголовки, добавив его в литиево перед ребенком ул,

+0

спасибо за советы и информацию –

7

вы должны обернуть каждый из внутреннего ул с литий

<ul class="navigation"> 
    <li> 
     <ul> 
      <li>...</li> 
     </ul> 
    </li> 
    <li> 
     <ul> 
      <li>...</li> 
     </ul> 
    </li> 
    <li> 
     <ul> 
      <li>...</li> 
     </ul> 
    </li> 
</ul> 
1

Вам нужно обернуть

<ul class="navigation"> 
<ul class="logo"> 

в

<ul class="navigation"> 
    <li> 
    <ul class="logo"> 
    ... 
    </ul> 
    </li> 

и т. Д.

3

Возможно, ваша структура неправильная. Логотип не является списком или списком. Как и элемент списка, который содержит , только другой список обычно бессмыслен.

Используйте заголовок элемента для логотипа (я обычно использую H1 для домашней страницы и H3 со ссылкой внутри него для других страниц):

<!-- for home page --> 
<h1 id="logo">Company</h1> 

<!-- for other pages --> 
<h3 id="logo"><a href="/">Company</a></h3> 

И убедитесь, что ваша навигация имеет правильную иерархию, как это:

<ul> 
    <li><a href="#">Products</a> 
     <ul> 
      <li><a href="#">Desktops</a></li> 
      <li><a href="#">Laptops</a></li> 
      <li><a href="#">Tablets</a></li> 
     </ul> 
    </li> 
    <li><a href="#">About</a> 
     <ul> 
      <li><a href="#">History</a></li> 
      <li><a href="#">Contacts</a></li> 
     </ul> 
    </li> 
</ul> 

В примере каждый LI имеет свою собственную ссылку и подразделы раздела, которые представляет ссылка, и, таким образом, текст ссылки заголовок для списка подразделов.

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