HTML – 是否可以仅在移动设备上使用Twitter Bootstraps .navbar

发布时间：2020-12-14 18:44:48 所属栏目：资源来源：网络整理

导读：我有这个导航栏的Twitter Bootstrap 3网页： div class="col-xs-12 col-md-10 col-md-offset-1" nav class="navbar navbar-inverse" role="navigation" div class="navbar-header" button class="navbar-toggle" type="button" data-toggle="collapse" data-

我有这个导航栏的Twitter Bootstrap 3网页：

<div class="col-xs-12 col-md-10 col-md-offset-1">
    <nav class="navbar navbar-inverse" role="navigation">
      <div class="navbar-header">
        <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".navbar-ex1-collapse">
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a href="#" class="navbar-brand">
          Title
        </a>
      </div>
      <div class="collapse navbar-collapse navbar-ex1-collapse">
        ...
      </div>
    </nav>
</div>

它在桌面上看起来很不错,有一些上边距.但是,是否可以仅在移动设备上使用.navbar-fixed-to-top？那么在移动设备上,导航栏始终位于顶部,没有顶部,左侧和右侧边距？

解决方法

您可以使用媒体查询,如下所示：

@media screen and (max-width: 480px)  
{
    nav.navbar
    {
       margin: auto; /*or the margin that you need*/
    }   
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!