请使用bootstrap v3进行新操作，我喜欢在响应时更改导航栏位置我希望将其浮动到标题内的徽标同一行的右侧
到
<div class="container">
<div id="content">
<div class="row">
<div id="header">
<div id="logo" class="col-lg-4 col-sm-4">
<a href="#"><img src="<?php echo base_url(); ?>public/img/logo.png" id="logo"></a>
</div>
<div id="client-num" class="col-lg-4 text-center">
<h1>Accueil fièrement plus de 1500 sites Web!</h1>
</div>
<div id="tollfree" class="col-lg-4 text-right">
<ul id="header-links" class="list-inline">
<li><a href="https://www.dothostia.com/client/cart.php?a=view" rel="nofollow">Panier</a></li>
<li><a href="#" rel="nofollow">Chat</a></li>
<li><a href="https://www.dothostia.com/client/clientarea.php" rel="nofollow">Espace Clients</a></li>
<li><a href="https://www.dothostia.com/client/pwreset.php" rel="nofollow">M.Perdu</a></li>
<li><a href="https://www.dothostia.com/client/register.php" rel="nofollow">Inscription</a></li>
</ul>
<img class="img-rounded" src="<?php echo base_url(); ?>public/img/tollfree.png" alt="">
</div>
</div>
</div>
<div class="clearfix"></div>
<nav class="navbar navbar-default" id="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" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse text-center navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav pull-right" id="navbar">
<li><a href="#">Hébergement Mutualisé</a></li>
<li><a href="#">Hébergement Revendeur</a></li>
<li><a href="#">Nom de Domaine</a></li>
<li><a href="#">Certificats SSL</a></li>
<li><a href="#">Serveurs VPS</a></li>
<li><a href="#" class="noborder">Serveurs Dédiés</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<img alt="DotHotstia" class="img-responsive" src="https://www.dothostia.com/public/img/home21.jpg">
</div>
</div>
谢谢
答案 0 :(得分：0)
将带有visible-xs的徽标添加到导航栏标题
<a class="navbar-brand visible-xs" href="#">
<img alt="Brand" src="img/logo.png">
</a>
当菜单折叠为按钮时，这将使徽标显示。您可能需要添加一些CSS来正确调整徽标的大小（或者更好地添加徽标的较小/较低版本并链接到该徽标）
您还需要将hidden-xs添加到现有徽标，以便同时隐藏它。
<div id="logo" class="col-lg-4 col-sm-4 hidden-xs">
<a href="#"><img src="img/logo.png" id="logo"></a>
</div>
完整代码
<div class="container">
<div id="content">
<div class="row">
<div id="header">
<div id="logo" class="col-lg-4 col-sm-4 hidden-xs">
<a href="#"><img src="<?php echo base_url(); ?>public/img/logo.png" id="logo"></a>
</div>
<div id="client-num" class="col-lg-4 text-center">
<h1>Accueil fièrement plus de 1500 sites Web!</h1>
</div>
<div id="tollfree" class="col-lg-4 text-right">
<ul id="header-links" class="list-inline">
<li><a href="https://www.dothostia.com/client/cart.php?a=view" rel="nofollow">Panier</a></li>
<li><a href="#" rel="nofollow">Chat</a></li>
<li><a href="https://www.dothostia.com/client/clientarea.php" rel="nofollow">Espace Clients</a></li>
<li><a href="https://www.dothostia.com/client/pwreset.php" rel="nofollow">M.Perdu</a></li>
<li><a href="https://www.dothostia.com/client/register.php" rel="nofollow">Inscription</a></li>
</ul>
<img class="img-rounded" src="<?php echo base_url(); ?>public/img/tollfree.png" alt="">
</div>
</div>
</div>
<div class="clearfix"></div>
<nav class="navbar navbar-default" id="navigation">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<a class="navbar-brand visible-xs" href="#">
<img alt="Brand" src="<?php echo base_url(); ?>public/img/logo.png">
</a>
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse text-center navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav pull-right" id="navbar">
<li><a href="#">Hébergement Mutualisé</a></li>
<li><a href="#">Hébergement Revendeur</a></li>
<li><a href="#">Nom de Domaine</a></li>
<li><a href="#">Certificats SSL</a></li>
<li><a href="#">Serveurs VPS</a></li>
<li><a href="#" class="noborder">Serveurs Dédiés</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<img alt="DotHotstia" class="img-responsive" src="https://www.dothostia.com/public/img/home21.jpg">
</div>
</div>