【JS Web 前端知识库】19.说一说CSS尺寸设置的单位

19.说一说CSS尺寸设置的单位

得分点：

px、rem、em、vw、vh

标准回答

1.px：

pixel像素的缩写，绝对长度单位，它的大小取决于屏幕的分辨率，是开发网页中常常使用的单位。

2.em：

相对长度单位，在 font-size 中使用是相对于父元素的字体大小，在其他属性中使用是相对于自身的字体大小，如width。如当前元素的字体尺寸未设置，由于字体大小可继承的原因，可逐级向上查找，最终找不到则相对于浏览器默认字体大小。

3.rem：

相对长度单位，相对于根元素的字体大小，根元素字体大小未设置，使用浏览器默认字体大小。

4.vw：

相对长度单位，相对于视窗宽度的1%。

5.vh：

相对长度单位，相对于视窗高度的1%。

加分回答 :

1. rem应用：

在移动端网页开发中，页面要做成响应式的，可使用rem配合媒体查询或者flexible.js实现。
原理:
是通过媒体查询或者flexible.js，能够在屏幕尺寸发生改变时，重置html根元素的字体大小，页面中的元素都是使用rem为单位设置的尺寸，因此只要改变根元素字体大小，页面中的其他元素的尺寸就自动跟着修改

2. vw应用：

由于vw被更多浏览器兼容之后，在做移动端响应式页面时，通常使用vw配合rem。
原理:
是使用vw设置根元素html字体的大小，当窗口大小发生改变，vw代表的尺寸随着修改，无需加入媒体查询和flexible.js，页面中的其他元素仍使用rem为单位，就可实现响应式。

💞💖💓💗每个时代，
✨🌟⭐️💫都悄悄犒赏会学习的人。