导航菜单不会链接到我的其他页面

时间:2016-10-28 15:37:20

标签: html

我将所有其他页面文件一起保存在一个文件夹中,每个文件都单独工作,但是当我单击其他菜单选项时,它会将我带到错误页面。我使用HTML和Sublime 2.定位菜单目录的网页似乎是我的主要问题。

<!doctype html>
<html lang="en">
<head>
<style>
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

li {
    float: left;
}

li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

li a:hover:not(.active) {
    background-color: #111;
}

.active {
    background-color: #4CAF50;
}
</style>
 </head>

 <body>
        <nav>
            <ul>
                <li><a href="home.html">Home</a></li>
                <li><a href="lawncare.html">Lawn Care</a></li>
                <li><a href="homeexterior.html">Home Exterior</a></li>
                <li><a href="kitchen.html">Kitchen</a></li>
                <li><a href="homeinterior.html">Home Interior</a></li>
                <li><a href="testyourself.html">Test Yourself!</a></li>

(The area above is whats not working, all the files are located in the same directory, but when i hit them on the webpage, safari, chrome, etc says the file cannot be found)
            </ul>
         </nav>

<h1>How to Protect Your Home from Pests</h1>

<img src="http://www.peterandpaulspestcontrol.com.au/files/media/thumbcache/011/c11/60b/ant.jpg">

    <section>
        <article>
        <p> Pests are very bad. They should be kept away from your stuff. This paragraph will be an intro and describe they lay out of the information.</p>
        </article>
    </section>
</body>
</html> 

2 个答案:

答案 0 :(得分:0)

确保您的文件(lawncare.htmlhomeexterior.html等)与home.html相互位于同一文件夹中,或者链接不起作用。< / p>

或者,如果您希望HTML文件位于另一个文件夹中,则必须在链接中的文件名之前添加该文件夹路径。例如,如果您将它们放在名为pages的文件夹中,则您的链接将如下所示:

<li><a href="pages/home.html">Home</a></li>
<li><a href="pages/lawncare.html">Lawn Care</a></li>

等等......

答案 1 :(得分:0)

试试这个: -

<A HREF="pages/about.html">About this site</A>