易如反掌！在窗口右侧，你会看到一个切换按钮，允许你在设计模式和开发模式之间切换。打开它，点击灰色画布区域查看整体设置，你会发现一个下拉菜单。在这里，你可以轻松地从px切换到rem。如果需要，你甚至还可以选择其他单位（稍后会介绍）。
在检查设计时，假设根字体大小为16px，所有以px为单位设置的内容都会自动转换为rem。如果发现其他单位，例如%，它会为你添加rem值作为注释。就是这样！
在Figma中，我们继续使用px进行设计，但开发人员可以随时切换到rems。
1rem=当前设置的根字体大小
根字体大小是网页的默认字体大小，在大多数浏览器中通常设置为16像素(px)。它是网页字体大小的参考点。使用rem单位（1rem等于根字体大小）可以在不同的设备和屏幕尺寸上轻松实现一致的字体大小缩放。下面有几个例子，请看我的演示！
在Figma等设计软件中，像素(px)通常用作绝对单位。这意味着在Figma中，1px代表一个特定的尺寸，在Figma中通常是1pt（1x比例）。使用像素进行设计为设计者提供了理想的精度和控制水平。然而，虽然固定的像素值似乎是设计师的梦想，但在转化为用于网页开发的CSS时，却会造成可访问性障碍，因为它们可能会推翻用户设置的字体大小偏好。
除了用户，开发人员还可以使用CSS调整根字体大小。通过使用html/root标签，开发人员可以覆盖默认大小，并设置自己喜欢的值。
:root{font-size:1rem;/*Originalrootfontsize:16px,defaultsetting*/}body{font-size:1rem;/*1remrepresentstherootfontsize(16px)*/}h1{font-size:3rem;/*Headingfontsize:48px(16px*3)*/}/*Changingtherootfontsize*/@media(min-width:768px){:root{font-size:1.25rem;/*Newrootfontsizeforlargerscreens:20px(16px*1.25)andeverythingelseaccordingly*/}}然而，使用像素（px）来设置大小会忽略用户的偏好。另一方面，使用相对单位（如rem）可以让开发人员在尊重用户偏好的同时调整文本大小。这种方法确保了设计控制和满足用户需求之间的平衡。
通过采用相对单位，我们可以满足不同的需求，并优先考虑无障碍性，确保我们的设计在视觉上具有吸引力，并对所有人都友好。
听起来还很抽象？这里有一些例子：
让我来解释一下为什么使用rem来定义根字体大小比使用px更合适。试想一下，您用像素（px）定义了所有字体大小。为简单起见，我们假设H1标题为48x，段落文本(p)为16px。这些值在屏幕上看起来可能是合理的，可读的。
当使用像素（px）表示字体大小时，它们会作为固定值覆盖浏览器的任何设置。就好像它们切断了与根字体大小的通信。例如，即使用户调整了根字体大小，如在我们的例子中将其从16x改为24px，显示的字体大小也不会受到影响。这就造成了可用性障碍，因为内容无法适应用户的偏好。
相比之下，利用rem作为根字体大小，字体大小就变成了相对大小，当用户修改浏览器设置时，字体大小就能按比例缩放。这种方法可确保更好的可访问性，并避免妨碍有不同视觉要求的用户。
是的，这是正确的。在使用基于像素（px）的字体大小时，用户可以放大和缩小。当用户缩放时，包括文本在内的整个页面都会被放大，这样就可以根据用户的喜好调整文本大小，而不会降低质量。
因此，你可能会质疑使用rem单位的必要性。虽然缩放确实可以帮助用户定制自己的阅读体验，但仍有一些注意事项需要牢记：
不，我没有关于使用缩放和使用用户字体大小预设的人数对比的研究。如果你有，请留言。在此之前，我更愿意迎合任何选择，尊重任何潜在的用户预设。
我们还可以使用em单位。rem和em单位的区别在于，rem单位计算的是相对于根字体大小的大小，而em单位计算的是相对于其最近父元素字体大小的大小。例如，如果根字体大小为16px，那么无论放在哪里，1rem始终等于16px。当嵌套在具有不同字体大小的多个元素中时，Em单位可以从父元素继承。
不过，正如你在下面的示例中看到的，em和rem一样，尊重用户的预设，允许根据用户的偏好设置进行灵活的响应式设计。
rem→浏览器根字体大小的倍数（r代表或根），例如：根字体大小=16px则1rem=16px
em→例如：容器的字体大小为32px，因此容器内（！！）的1em=32px
其实不然，我们可以计算它，不过这有点矫枉过正，而且会变得相当复杂，在纯粹的用户界面设计中意义不大。但这并不意味着以后不应该在代码中使用它们！就我个人而言，我经常坚持使用rem单位，但我会确保向开发团队说明，他们可以随时灵活地将这些单位重新定义为其他选项，如em。
rem单位元是专门针对CSS和网页开发的，但我们并不总是只针对CSS进行设计。换句话说，没有CSS，没有浏览器，就没有根字体大小。例如，我们也可能为iOS或Android等本地应用程序进行设计，每种应用程序都有自己的无障碍考虑因素。对于iOS，一个重要的无障碍功能就是动态字体。
动态字体允许用户自定义设备上的文字大小，以提高可读性和可访问性。如果您使用的是Kindle，这一点可能并不陌生。通过遵守动态字体和平台指南，我们可以确保其应用程序的文本调整为用户偏好的文本大小，从而创造更具包容性的体验。同样，安卓系统也提供了字体缩放和文字大小调整等无障碍功能。