bootstrap 4将ul列表转换为移动列
Posted
技术标签:
【中文标题】bootstrap 4将ul列表转换为移动列【英文标题】：bootstrap 4 convert ul list to a column for mobile 【发布时间】：2018-08-25 22:38:08 【问题描述】：我正在使用 bootstrap 4。我有一个看起来像这样的链接列表。
这是我的html
<ul class="list-inline footer-main-links">
<li class="list-inline-item"><a href="/shop/">Shop</a></li>
<li class="list-inline-item"><a href="/review/">Reviews</a></li>
<li class="list-inline-item"><a href="/faq/">FAQ</a></li>
...
如何使智能手机的列表如下图所示？我想充分利用 bootstrap 4 类/实用程序。
【问题讨论】：
【参考方案1】：您可以将nav 与响应式网格列一起使用...
<ul class="nav footer-main-links row text-center text-uppercase">
<li class="nav-item col-6 col-md"><a href="/shop/">Shop</a></li>
<li class="nav-item col-6 col-md"><a href="/review/">Reviews</a></li>
<li class="nav-item col-6 col-md"><a href="/faq/">FAQ</a></li>
<li class="nav-item col-6 col-md"><a href="/review/">Returns</a></li>
<li class="nav-item col-6 col-md"><a href="/review/">Story</a></li>
<li class="nav-item col-6 col-md"><a href="/review/">Partner</a></li>
<li class="nav-item col-6 col-md"><a href="/review/">Refer a friend</a></li>
</ul>
演示：https://www.codeply.com/go/LFROz8QVsi
【讨论】：
以上是关于bootstrap 4将ul列表转换为移动列的主要内容，如果未能解决你的问题，请参考以下文章