3

我正在调整水平列表中的间距，似乎我有一个空白的第一个条目，生成一个分隔符（右边框）。增加和减少填充，扩大和缩小列表中的第一个幻像条目。

此页面上的导航栏http://compuball.com/GW2/guides/ranger/pages/pet_basics_101.html

分隔条创建在菜单项的右侧……第一个分隔符跟在一个不应该存在的项之后。

的CSS：

NAV {
    width: 940px;
    float: left;
    font-family: Geneva,Arial;
    border: 6px outset #A96505;
    background-color: #F4CB90;
}

NAV ul {
    margin: 0px auto;
    padding: 0px;
    list-style-type: none;
}

NAV li {
    display: inline;
}

NAV li a {
    text-align: center;
    border-right: 2px groove #C6995F;
    font-size: 1.6em; 
    padding: 2px 10px;
    color: #A96505;
    text-decoration: none;
}

NAV li a.last {
    border-right: none;
}

NAV li a:hover {
    color: #6D3F02;
}

的HTML：

    <NAV>
        <UL>
            <LI><a href="#top">Home</a></LI>
            <LI><a href="#Intro">Introduction</a></LI>
            <LI><a href="#Charming">Acquiring Pets</a></LI>
            <LI><a href="#Classification">Classification</a></LI>
            <LI><a href="#Control">Control Panel</a></LI>
            <LI><a Class="last" href="#Management">Management Panel</a></LI>
        </UL>
    </NAV>
4

3 回答 3

2

你的问题是这样的：

<HEAD>
  <A ID = "top" />
</HEAD>

您要做的是将其移出<head>文档，并将其移到<body>标签之后。此外，鉴于下面的优秀评论，我们应该让它看起来像这样，因为<a>标签不会自动关闭：

<a id="top"></a>
于 2012-10-25T01:52:03.437 回答
2

好的，这里有一个明确的问题 - 在 FireBug 中查看时，在<a id="top">进入 Wrapper 部分之前，您有四个实例。其中之一是在您的导航列表中，创建一个元素（然后被填充等）。

我猜您想要一个内部链接，使用户无需滚动即可到达页面顶部。这涉及页面顶部的一个目标引用（不在导航列表中），如下所示：<a name="top"></a>以及页面下方的尽可能多的相应链接，如下所示：<a href="#top">Back to Top<a>. 这将使屏幕顶部回到页面上目标引用所在的点。

所以。清除所有实例<a id="top"></a>并将它们替换为页面顶部的一个适当的目标引用（<body>例如，就在开始标记之后），你应该没问题。

于 2012-10-25T03:18:58.847 回答
1

你的第一个 li 实际上有两个 a 标签，其中一个不确定它是如何出现的，因为它在你查看源代码时没有显示，但它就在那里。在 Chrome 中右键单击主页链接并选择检查元素，您将看到它在那里列出。

您是手动输入此 HTML 还是为您生成它？

在您的页面顶部附近，您有：

 <A ID = "top" />

a 标签不会自动关闭，因此发生的情况是该标签在找到菜单中的第一个标签之前不会关闭，从而在菜单中创建一个额外的元素。

<a id="top"></a>

将使用额外的菜单项解决您的问题

运行您的页面：http: //validator.w3.org以查找其他错误（您的错误非常少！干得好！）

于 2012-10-25T01:49:31.543 回答