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.

Sign up for GitHub

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

Jump to bottom

如何解决移动端 Retina 屏 1px 像素问题 #22

Open
hanyueqiang opened this issue Dec 3, 2020 · 0 comments
Open

如何解决移动端 Retina 屏 1px 像素问题 #22

hanyueqiang opened this issue Dec 3, 2020 · 0 comments

Comments

@hanyueqiang
Copy link
Owner

hanyueqiang commented Dec 3, 2020 •
edited
Loading

viewport + rem 实现
在根元素html设置font-size. 将元素转换成rem，通过 window.devicePixelRatio 拿到dpr 再写meta 设置 viewport的scale : 1/dpr

参考：使用Flexible实现手淘H5页面的终端适配
Flexible实现思路：

  • 动态改写<meta>标签
  • 给<html>元素添加data-dpr属性，并且动态改写data-dpr的值
  • 给<html>元素添加font-size属性，并且动态改写font-size的值
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@hanyueqiang