Bootstrap像去點(diǎn)列表一樣，通過添加類名“.list-inline”來實(shí)現(xiàn)內(nèi)聯(lián)列表，簡單點(diǎn)說就是把垂直列表換成水平列表，而且去掉項(xiàng)目符號(hào)（編號(hào)），保持水平顯示。也可以說內(nèi)聯(lián)列表就是為制作水平導(dǎo)航而生。
/*源碼查看bootstrap.css文件第584行~第593行*/
.list-inline {
padding-left: 0;
margin-left: -5px;
list-style: none;
}
.list-inline > li {
display: inline-block;
padding-right: 5px;
padding-left: 5px;
}
看個(gè)示例：
<ul class="list-inline"> <li>W3cplus</li> <li>Blog</li> <li>CSS3</li> <li>jQuery</li> <li>PHP</li> </ul>
我也來試試：完成下面任務(wù)
在右側(cè)代碼編輯器第18行輸入正確代碼，讓列表項(xiàng)水平顯示，如下圖所示：
備注:這一小節(jié)沒有正確性驗(yàn)證，請(qǐng)查看結(jié)果窗口與任務(wù)所給的結(jié)果圖片是否一致，從而判斷輸入代碼是否正確。
參考代碼：
<ul class="list-unstyled">
<li>
城市：
<ul class="list-inline">
<li>北京</li>
<li>上海</li>
<li>南京</li>
<li>廈門</li>
</ul>
</li>
</ul>
請(qǐng)驗(yàn)證，完成請(qǐng)求
由于請(qǐng)求次數(shù)過多，請(qǐng)先驗(yàn)證，完成再次請(qǐng)求
打開微信掃碼自動(dòng)綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書簽
舉報(bào)