react可视化项目如何自适应屏幕?

Question

我们的项目最小分辨率是1920，最大是3840，如font-size，width，height等等可以随着屏幕的缩放而缩放，大家有没有什么成熟的技术方案，参考一下

Answer 1

用媒体查询设置html { font-size: },要根据屏幕进行缩放的元素的宽高字体大小使用rem
例如
@media screen and (min-width: 621px) and (max-width: 639px) {

html {
  font-size: 100px;
}

}

那么此时1rem = 100px,你可以根据设计图上的px数值除以当前html的font-size来计算rem的数值

Answer 2

你可以了解一下rem。会根据body的font-size自动计算width 与 height

Answer 3

有好的方案吗 分享一下