Question

我创建了ul li子菜单。如果我将鼠标悬停在锚标签上，则子菜单会从左侧显示空格。我不知道我应该在css中使用什么属性来移除左侧空间

此外，我想知道如何为平板电脑编写只响应一台设备的内容。

我的code

 <div id="nav">
    <ul><li><a href="#">first</a>
    <ul class="submenu">
    <li><a href="#">one</a></li>
    <li><a href="#">two</a></li>
    <li><a href="#">three</a></li>
    </ul>
    </li></ul><!--endofsubmeunu-->
    <ul><li><a href="#">second </a>
    <ul class="submenu">
            <li><a href="#">one</a></li>
            <li><a href="#">two</a></li>
            <li><a href="#">three</a></li>
    </ul></li></ul><!--endofsubmeunu-->
    <ul>
    <li><a href="#">third</a></li>
    </ul>
    <ul>
    <li><a href="#">fifth</a></li>
    </ul>
    <ul>
    <li><a href="#">sixth</a></li>
    </ul>
    <ul>
    <li><a href="#">seven</a></li>
    </ul>
    <ul>
    <li><a href="#">eight</a></li>
    </ul>
    </div><!--endofnav-->
    </div><!--endofwrapper-->

My CSS：

 body
    {

    height:auto;
    margin:auto;
    }

    #wrapper
    {
    width:1000px;
    height:auto;
    margin:auto;
    }

    #nav ul li
    {
    width:100px;
    height:auto;
    float:left;
    }
    #nav ul .submenu
    {
    display:none;
    }

    #nav li:hover .submenu
    {
    display:block;
    }

Answer 1

DEMO：http://jsfiddle.net/vybv5ayv/

请关注：

#nav li:hover .submenu
{
display:inline;
}

菜单没有按我想要的方式设置

1 个答案: