Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
kusofte-chap opened this issue Feb 5, 2021 · 3 comments
Open

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

kusofte-chap opened this issue Feb 5, 2021 · 3 comments

Comments

@kusofte-chap
Copy link

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

@uxsi
Copy link
Collaborator

uxsi commented Mar 3, 2021

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

@kusofte-chap
Copy link
Author

kusofte-chap commented Mar 17, 2021

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问题截图

@kusofte-chap
Copy link
Author

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

Uploading weui问题截图.jpeg…

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants