关于无序列表的疑问

问题描述 投票:0回答:1

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

   Home    Fixtures        Results    Leaderboard  
           Upcoming Week              Goals
           Month                      Assists

有人可以帮帮我吗?

html css html-lists navigationbar
1个回答
0
投票

你可以这样做,

<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;
}
© www.soinside.com 2019 - 2024. All rights reserved.