bootstrap导航条的菜单项怎么居中呀?

如题,求指点.上代码最直接了……今天试了一下珊拦布局(百度上有人说),可是效果并不能达到……而且有直接加div限定的,但是就不是响应式的了……求大神指点
大咪
浏览 10037回答 1
1回答

神圣的誓言

<!DOCTYPE html><html lang="zh-cn"><head>    <meta charset="utf-8">    <meta http-equiv="X-UA-Compatible" content="IE=edge">    <meta name="viewport" content="width=device-width, initial-scale=1">    <title>Bootstrap 101 Template</title>    <link href="css/bootstrap.min.css" rel="stylesheet">    <script src="js/jquery-3.1.1.min.js"></script>    <script src="js/bootstrap.min.js"></script></head><body><div class="container">    <div class="row">        <div class="col-md-12">            <nav class="navbar navbar-default" role="navigation">                <div class="container-fluid"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header">                        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">                            <span class="sr-only">Toggle navigation</span>                            <span class="icon-bar"></span>                            <span class="icon-bar"></span>                            <span class="icon-bar"></span>                        </button>                        <a class="navbar-brand" href="#">Brand</a>                    </div> <!-- Collect the nav links, forms, and other content for toggling --> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">                        <ul class="nav navbar-nav">                            <li class="active"><a href="#">Link</a></li>                            <li><a href="#">Link</a></li>                            <li class="dropdown">                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>                                <ul class="dropdown-menu" role="menu">                                    <li><a href="#">Action</a></li>                                    <li><a href="#">Another action</a></li>                                    <li><a href="#">Something else here</a></li>                                    <li class="divider"></li>                                    <li><a href="#">Separated link</a></li>                                    <li class="divider"></li>                                    <li><a href="#">One more separated link</a></li>                                </ul>                            </li>                        </ul>                        <form class="navbar-form navbar-left" role="search">                            <div class="form-group">                                <input type="text" class="form-control" placeholder="Search">                            </div>                            <button type="submit" class="btn btn-default">Submit</button>                        </form>                        <ul class="nav navbar-nav navbar-right">                            <li><a href="#">Link</a></li>                            <li class="dropdown">                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>                                <ul class="dropdown-menu" role="menu">                                    <li><a href="#">Action</a></li>                                    <li><a href="#">Another action</a></li>                                    <li><a href="#">Something else here</a></li>                                    <li class="divider"></li>                                    <li><a href="#">Separated link</a></li>                                </ul>                            </li>                        </ul>                    </div><!-- /.navbar-collapse --> </div><!-- /.container-fluid --> </nav>        </div>    </div></div></body></html>把导航条标准格式代码放入栅格中,就这么简单,思路很重要,不能给父盒子设定宽度
打开App,查看更多内容
随时随地看视频慕课网APP