html - 响应式布局上的 Twitter Bootstrap 平板电脑尺寸 1024 而不是 979

Question

我不明白为什么 Twitter Bootstrap 将平板电脑的尺寸从 768 考虑到 979，而不是从 768 到 1024（iPad）。问题是，如果客户要求为平板电脑定制设计，平板电脑设计将不会在 iPad 上以横向模式显示。

另外，如果我有一个带有侧边栏（span9 + span3）的内容，如果侧边栏是“隐藏平板电脑”，则内容不会扩展，实际上它会具有相同的大小，我必须覆盖引导程序跨度尺寸以实现所需布局。

难道我做错了什么？

Answer 1

1）我认为这里的想法是，一般来说，如果有人请求的页面超过 980 像素，则它更有可能来自台式计算机而不是来自 ipad。你也可以让你的页面 ipad 和 web 对这些宽度友好:)。

如果您必须为横向 ipad 和 web 设计不同的设计，则可以选择为屏幕在 980 到 1024px 之间时编写一堆自定义 css。

@media (min-width 980px) and (max-width: 1024px) {
  //my custom css for ipad landscape
}

2）你做对了。一切.hidden-tablet就绪display: none;

@media (min-width: 768px) and (max-width: 979px) {
  // ... some other code

  .hidden-tablet {
    display: none !important;
  }
}

它不做任何其他类型的调整大小，所以这取决于你来处理媒体查询。