使用长度单位
body {
/* Sets the font-size for all text */
font-size: 0.8em;
}
div {
/* Sets the min/max width of a division */
width: 100%;
min-width: 900px;
max-width: 1600px;
}
以上只是示例，根据不同的布局选择不同的单位。
在 HTML 和 CSS 中，长度单位帮助我们控制元素的尺寸和位置。
传统上，像素单元非常流行，因为它可以精确控制元素的尺寸。
最近，Em 开始替换像素，因为它具有更大的灵活性。
| Pixels (px) | 一个单位的PX等于屏幕上的一个点。由于浏览器实现了“页面缩放”，它几乎与过去使用像素一样糟糕。 |
|---|---|
| Ems (em) | 1EM等于16px，具体取决于父元素字体大小。我们建议在正文元素上设置默认字体大小以更好地控制1EM对应的内容。 |
| Exes (ex) | 一个“EX”等于“X”的大小，（类似于EM的“M”）。 |
| Percentages (%) | 非常适合灵活和流体布局，通常是声明以像素的最小和最大宽度的好主意。 |
| Inches (in) | 最适合打印介质类型。 |
| Centimeter (cm) | 最适合打印介质类型。 |
| Millimeter | 最适合打印介质类型。 |
在需要像素精度的情况下，像素是理想的选择。
通常当我们处理大量光栅图形或者图像背景时。
这并不像某些设计师想要的那么糟糕，但我们可能仍要考虑使用 CSS 媒体查询来设计各种屏幕分辨率。
要创建自动适合屏幕分辨率的布局，百分比和 EM 的组合通常是最佳选择。
日期：2020-06-02 22:17:29 来源：oir作者：oir