Question

我正在尝试使用bootstrap.css实现布局。特别是右侧边栏的主视图。它在桌面上看起来很棒，但我想在移动视图时删除侧边栏。目前我的布局如下：

<div class="container-fluid">
   <div class="row-fluid">
      <div class="span9">
         Main view goes here
      </div>
      <div class="span3 visible-desktop visible-tablet hidden-phone">
         Sidebar goes here
      </div>
   </div>
</div>

因此，当我有移动视图时，侧边栏就会消失。但是主视图仍然有一个span9类，导致整个视图右边有一些空格。我目前正在使用移动游猎的iPhone 4上体验这一点。

我不是css大师，我主要处理webapps的后端，但这次我只是想做正确的，因为它是我的个人博客。你可以在my blog查看我对这个“空白”的意思。我知道导航栏现在并不漂亮，但这将是我要解决的下一件事。

Answer 1

在www.responsinator.com上查看我猜右边没有这样的白色间距。此外，当在除桌面之外的任何其他设备上打开站点时，row-fluid类引导程序将每个子span类转换为全宽。因此，无论如何，当您在iPhone4上打开width:100%时，span9会被分配给container-fluid。

似乎有两个原因可能在右边有一点空间：
1.文字不合理。
2. {{1}}在左侧和右侧添加20px的填充。

希望它有所帮助。：）

bootstrap.css - 移动时如何隐藏侧边栏？

1 个答案: