Tencent / weui

A UI library by WeChat official design team, includes the most useful widgets/modules in mobile web applications.

Home Page:https://weui.io

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

rem适配方案下weui下的组件样式变形

kusofte-chap opened this issue · comments

commented

H5项目中,使用动态设置html的font-size,在通过rem做单位适配页面布局,但是该方案会影响WeUI组件样式,请问有什么解决方案嘛?

commented

@kusofte-chap 请问是怎么影响到的呢?方便提供下截图吗?

commented

1、设计稿按750设计的
2、在项目里使用rem适配方案具体代码如下:
const html = document.getElementsByTagName("html")[0];
const resize = () => {
html.style.fontSize =
Math.min(Math.max(document.body.clientWidth, 320) / 7.5, 100) + "px";
};
window.addEventListener("resize", resize, false);
resize();

加入上述代码之后页面里引用的weui组件样式会受到影响无法适配移动端,截图:
weui问题截图

commented

@kusofte-chap 请问是怎么影响到的呢?方便提供下截图吗?

Uploading weui问题截图.jpeg…