Question

我的菜单中有一个项目因为没有明显原因而被击倒。

<html>
    <head>
    <title>
    My first Site
    </title>
    </head>
    <body>
    <ul>
  <li><a href="My first site.html"><H1>Home</H1></a></li>
  <li><a href="Testimonials.html"><H1>Testimonials</H1></a></li>
  <li><a href="Schedule.html"><H1>Schedule</H1></li>
  <li><a href="About.html"><H1>About</H1></a></li>
  <li><a href="Contact.html"><H1>Contact</H1></a></li>
</ul>
    </body>
    <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;
}

/* Change the link color to #111 (black) on hover */
li a:hover {
    background-color: #111;
}
</style>
</head>
<body>



    </style>
</html>

结果如下：

我正在使用Chrome

Answer 1

添加了代码段

的结束标记

＆＃13;

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 {
    background-color: #111;
}

＆＃13;

<html>
<head><title>My first Site</title></head>
<body>
    <ul>
        <li><a href="My first site.html"><h1>Home</h1></a></li>
        <li><a href="Testimonials.html"><h1>Testimonials</h1></a></li>
        <li><a href="Schedule.html"><h1>Schedule</h1></a></li>
        <li><a href="About.html"><h1>About</h1></a></li>
        <li><a href="Contact.html"><h1>Contact</h1></a></li>
    </ul>
</body>
</html>

＆＃13;

菜单项被撞倒了

1 个答案: