Bootstrap的去點(diǎn)列表

通過(guò)給無(wú)序列表添加一個(gè)類名“.list-unstyled”,這樣就可以去除默認(rèn)的列表樣式的風(fēng)格

在Bootstrap中默認(rèn)情況下無(wú)序列表和有序列表是帶有項(xiàng)目符號(hào)的，但在實(shí)際工作中很多時(shí)候，我們的列表是不需要這個(gè)編號(hào)的，比如說(shuō)用無(wú)序列表做導(dǎo)航的時(shí)候。

Bootstrap為眾多開發(fā)者考慮的非常周道，通過(guò)給無(wú)序列表添加一個(gè)類名“.list-unstyled”,這樣就可以去除默認(rèn)的列表樣式的風(fēng)格。
/*源碼請(qǐng)查看bootstrap.css文件第580行~第583行*/


.list-unstyled {
padding-left: 0;
list-style: none;
}

從示例中可以看出，除了項(xiàng)目編號(hào)之外，還將列表默認(rèn)的左邊內(nèi)距也清０了。

<!--無(wú)序列表去點(diǎn)-->
<ul>
    <li>
    項(xiàng)目列表
        <ul>
        <li>帶有項(xiàng)目符號(hào)</li>
        <li>帶有項(xiàng)目符號(hào)</li>
        </ul>
    </li>
    <li>
    項(xiàng)目列表
        <ul class="list-unstyled">
        <li>不帶項(xiàng)目符號(hào)</li>
        <li>不帶項(xiàng)目符號(hào)</li>
        </ul>
    </li>
    <li>項(xiàng)目列表</li>
</ul>
<!--有序列表去序號(hào)-->
<ol>
    <li>
    項(xiàng)目列表
        <ol>
        <li>帶有項(xiàng)目編號(hào)</li>
        <li>帶有項(xiàng)目編號(hào)</li>
        </ol>
    </li>
    <li>
    項(xiàng)目列表
        <ol class="list-unstyled">
        <li>不帶項(xiàng)目編號(hào)</li>
        <li>不帶項(xiàng)目編號(hào)</li>
        </ol>
    </li>
    <li>項(xiàng)目列表</li>
</ol>