rem在移动端自适应设置的问题

我给input设置了margin-top:30rem;在chrome的模拟器里显示差别太大,是因为屏幕的initial-scale不同的原因吗?应该如何解决?

想实现的效果是input相对箭头的距离不变,额(⊙o⊙)…箭头必须包含在背景图里,越说越没底气……

(我是参照物+黄色箭头+蓝色背景 = bg.jpg 是body的background)
clipboard.png
clipboard.png
clipboard.png

阅读 5.4k
3 个回答

rem是html字体的size。
看你这么说,应该没有通过js或媒体查询动态设置rem。
所以1rem = 16px(默认字体大小)。
其实你说的30rem,就是480px。
那么自然不同的屏幕高度,位置不一样。

rem布局,推荐参考:
https://github.com/amfe/lib-f...
https://isux.tencent.com/web-...

使用 rem 适配, 如果要在所有分辨率下都能精准响应, 需要用到 JavaScript 动态地为根元素设定一个 font-size. 题主没有做这样的计算.

高清适配原理我做过分析: https://segmentfault.com/a/11...

你这个应该是没有设置html的font-size

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏