快速使用flexbox和margin utils…中心品牌和链接
<nav > <button type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation"> <span ></span> </button> <div > <a href="#">Navbar</a> <div id="navbarNavAltMarkup"> <div > <a href="#">Home <span >(current)</span></a> <a href="#">Features</a> <a href="#">Pricing</a> <a href="#">Disabled</a> </div> </div> </div></nav>
Bootstrap 4.1 中心品牌，在移动设备上向左对齐
EDIT..
答案仍然基本相同。使用mx-auto到中心。
<nav > <button type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation"> <span ></span> </button> <a href="#">Navbar</a> <div id="navbarNavAltMarkup"> <div > <a href="#">Home <span >(current)</span></a> <a href="#">Features</a> <a href="#">Pricing</a> <a href="#">Disabled</a> </div> </div></nav>
