Html 引导V4 alpha-如何在不接触css的情况下集中对齐导航项目
我有一个导航栏在左边,有几个下拉菜单。我想让文本在下拉列表中居中对齐,或者在导航栏中更好地表示下拉列表。怎么做?(如果可能,无需修改css) 我当前的代码片段-Html 引导V4 alpha-如何在不接触css的情况下集中对齐导航项目,html,css,twitter-bootstrap,drop-down-menu,Html,Css,Twitter Bootstrap,Drop Down Menu,我有一个导航栏在左边,有几个下拉菜单。我想让文本在下拉列表中居中对齐,或者在导航栏中更好地表示下拉列表。怎么做?(如果可能,无需修改css) 我当前的代码片段- <nav class="col-sm-3 col-md-2 hidden-xs-down bg-faded sidebar"> <ul class="nav nav-pills flex-column"> <li class="nav-item">
<nav class="col-sm-3 col-md-2 hidden-xs-down bg-faded sidebar">
<ul class="nav nav-pills flex-column">
<li class="nav-item">
<a class="nav-link active" href="https://v4-alpha.getbootstrap.com/examples/dashboard/#">Overview <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Region</a>
<div class="dropdown-menu">
<h6 class="dropdown-header">Dropdown header</h6>
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Separated link</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Category</a>
<div class="dropdown-menu">
<h6 class="dropdown-header">Dropdown header</h6>
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Separated link</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Brand</a>
<div class="dropdown-menu">
<h6 class="dropdown-header">Dropdown header</h6>
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Separated link</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Packaging</a>
<div class="dropdown-menu">
<h6 class="dropdown-header">Dropdown header</h6>
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Separated link</a>
</div>
</li>
<!--<li class="nav-item">-->
<!--<a class="nav-link" href="https://v4-alpha.getbootstrap.com/examples/dashboard/#">Analytics</a>-->
<!--</li>-->
</ul>
</nav>
-
-
下拉标题
-
下拉标题
-
下拉标题
-
下拉标题
我不知道你说的“中心对齐”是什么意思。您可以使用文本中心水平对齐文本
<ul class="nav nav-pills flex-column text-center">
</ul>