English 我想知道为什么选择Boostraprem而em不是选择px新版本的Boostrap 4。
一些变量示例：
$font-size-h1: 2.5rem !default;
$font-size-h2: 2rem !default;
$font-size-h3: 1.75rem !default;
$mark-padding: .2em !default;
最好将em和rem用于以下用途：
margin: 0;
padding: 0;
bottom: 0px;
width: 100%;
我只是很好奇我无法在网上找到有关此内容的信息，所以我想问这个原因。
不久前我改用rems而不是px，我可以告诉你这是最好的选择。
Rems具有100％的可扩展性，我的尺寸全部基于笔记本电脑及以下产品的外观，然后在1600px或更高的媒体查询条件下，调整html字体大小和中提琴！，整个网站将按比例“放大” 100％。
我现在也开始整合大众汽车，以增加需要像英雄部分中所显示的那样大的部分填充和字体，将其与calc结合使用，例如calc（3rem + 2vw），您便拥有了一个可扩展性非常强的网站，只需很少的媒体查询。
使用rems时，您需要将html字体大小重置为16px。
html {
font-size: 62.5%;
}
现在，1rem = 10px
因此，调整大小都非常容易转换。
30px现在是3rem，25px现在是2.5rem，15px现在是1.5rem，依此类推。
然后在更大的屏幕上，将html更改为font-size：70％，一切都会按比例放大。
确保对媒体查询使用px，例如：@media only screen和（最小宽度：1680px）
但是“最大宽度”可以是px或rems，仅取决于设计。
我现在将wraps设置为90vw，这可以防止任何东西触摸屏幕边缘，并且可以100％缩放。
.wrap {
margin-left: auto;
margin-right: auto;
width: 90vw;
max-width: 145rem; /* or use px depending on the design */
}
You can use % too, but with WP Gutenberg out and their full width sections using vw I can get everything to line up to a perfect grid.
Hope this helps.
REM在几乎任何明确设置大小的地方都非常有用。
使用rem，所有字体大小都相对于根元素（又称为html标记）。这样做的原因是为了简化设备的放大或缩小。您可以从技术上将html标记更改为较小或较大的大小，以均等缩放所有字体大小，这是一个非常好的功能。
... [要了解的主要内容是，所有内容都是动态的，并且相对于根HTML标记而言。
例如，将html css font-size更改为其他数字...并观察整个网格如何调整和缩放。
资料来源：Scotch.io
值得一提的是，Bootstrap 4保留断点
px而不保留断点em。从文档：