引导iPad上的响应布局隐藏导航(Bootstrap Responsive layout hide

引导有一个惊人的响应布局系统，但有时它与视网膜屏幕大小是不是很“正确”。

例如，我的视网膜iPad拥有巨大的屏幕尺寸，但实际显示效果是不一样的。 在iPad上，我想隐藏在左侧的导航组件，并使用在头控制的展开按钮显示/隐藏，但是，我的iPad视网膜碰到屏幕尺寸大，因此不隐藏。

我已经使用引导3班得到了我的左侧导航栏： nav-left nav-collapse ，我意识到我可以调整分钟/中/最大尺寸，但我不认为那是正确的做法。 我在想什么？

Answer 1:

使用样式您的网页@media查询。

像这样：

@media视网膜

@media only screen 
  and (min-device-width: 1536px)
  and (max-device-width: 2048px)
  and (orientation: landscape)
  and (-webkit-min-device-pixel-ratio: 2) {
  .nav-left {
    /* STYLE HERE YOUR MIN/MAX SIZE */
  }

  .nav-collapse {
    /* STYLE HERE YOUR MIN/MAX SIZE */
  }
}

---

@media为iPad横向和纵向

@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) {
  /* STYLES GO HERE */
}

@media为iPad / iPhone @media查询的来源

文章来源: Bootstrap Responsive layout hide nav on iPad