Html <；br/>；制造另一个<；李>'；让我们离开车道

这就是当我在其中一个

中使用另一个

时发生的情况： 使用

：

没有

：

我真的不知道我是否应该在这里使用ul，li。如果你告诉我就好了。 我的代码： html

---

提前感谢，等待帮助

正如迪奥德斯所说，您的标记无效。它应该是这样的：

HTML:

<div class="menu">
    <ul>
        <li><a href="#link">Text</a></li>
        <li><a href="#link">Text</a></li>
        <li><a href="#link">Text</a></li>
        <li><a href="#link">Text</a></li>
        <li><a href="#link">Text in two lines</a></li>
    </ul>
</div>

虽然你可以在那里有一个段落标记，但因为你只有少量的文本，这真是太过分了（除非你需要额外的钩子来设计样式或做些什么）

---

使用

时仍然存在相同的问题。另一个按钮被按下 放下

如果您有

显示：内联块

，您还需要

垂直对齐：顶部

---

（默认值为

垂直对齐：基线

）

您的HTML无效。不能将其他元素放在LI之外的列表中。他们一定都在里边。你所做的永远不会起作用css。我把所有东西都放在一个LI中，但仍然是相同的问题。当我使用
时仍然是相同的问题。另一个按钮被按下。我添加了一个指向JSFIDLE的链接，我认为这将解决您的问题。

.menu{
    height: 96px;
    text-align: center;
}

.menu ul{
    list-style-type: none;
}

.menu li{
    display: inline-block;
    height: 96px;
    width: 96px;
    margin-left: 10px;
    background-image: url("../images/menu-button.png");
}

.menu li:hover{
    background-image: url("../images/menu-button-hover.png");
}

.menu p{
    top:40px;
    position:relative;
}

.menu a{
    text-decoration: none;
    color: black;
}

.menu a:hover{
    text-decoration: none;
    color: black;
}

<div class="menu">
    <ul>
        <li><a href="#link">Text</a></li>
        <li><a href="#link">Text</a></li>
        <li><a href="#link">Text</a></li>
        <li><a href="#link">Text</a></li>
        <li><a href="#link">Text in two lines</a></li>
    </ul>
</div>