html - 关于无序列表的疑问

Question

我想显示一个级联的无序列表，如下所示:

   Home    Fixtures        Results    Leaderboard  
           Upcoming Week              Goals
           Month                      Assists

有人可以帮帮我吗？

Answer 1

你可以这样做，

<ul class="main-ul">
    <li>Home</li>
    <li>
        <ul class="inner-ul">
            <li>Fixtures</li>
            <li>Upcoming Week</li>
            <li>Month</li>
        </ul>
    </li>
    <li>Results</li>
    <li>
        <ul class="inner-ul">
            <li>Leaderboard</li>
            <li>Goals</li>
            <li>Assists</li>
        </ul>
    </li>
</ul>

和下面的 css，

ul.main-ul {
    float: left;
    width: 100%;
    text-align: left;
}
ul.main-ul>li {
    list-style: none;
    float: left;
    margin: 0 20px;
}
ul.inner-ul>li {
    list-style: none;
}