css - 关于 Bootstrap 示例

Question

我是 html 和 css 的新手，所以我只是实现了这个网站 http://getbootstrap.com/docs/4.1/examples/dashboard/ 当我按 cmd + '+ 放大时，我不希望左侧边栏消失' 或 Ctrl + '+'。（我想我可能想在手机屏幕上看到桌面版的网页。）也许这与dashboard.css文件中的sticky有关，但我不知道该怎么做。您可以通过查看上面链接中的源代码来查看dashboard.css 和相关文件。谢谢！

标签： cssbootstrap-4

Answer 1

您可以将em单元与媒体查询一起使用

.rwd-container {
   width : 50px;
   height : 50px;
   margin : 0 auto;
    background-color: blue;
}

@media (max-width: 30em) {
  .rwd-container {
    background-color: red;
  }
}

<div class="rwd-container"></div>

https://jsfiddle.net/o4s18wmL/8/

30em = 基本字体大小（16px）* 30 = 480px；

---

宽度 519px 超过 30em(480px)，媒体查询不适用于工作

---

缩放 font-size:110% ，宽度 461.278px 小于 30em(480px) ，媒体查询将起作用

---

有关的：

• 缩放挤压