flexible-mobile
Advanced tools
npm install flexible-mobile --save
基准 = 宽度拆分份数 = 设计稿宽度 / 每rem的px
以375的设计稿为例，如最终1rem=12px，则基准= 375 / 12 = 31.25；如1rem=14px，则基准= 375 / 14 = 26.785714286；如1rem=100px，则基准= 375 / 100 = 3.75。 也可在js处设置：window.remscale = 31.25。 原lib-flexible框架固定该值为10，现可根据实际情况自定义设置。
<html>
<head>
<meta name="rem-baseline" content="31.25" />
</head>
<body>
</body>
</html>
设置viewport，则后续适配都以该viewport的配置为准，不再自适应scale
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
</head>
<body>
</body>
</html>
设置initial-dpr，则后续适配都以该dpr为准，不再使用设备自身的dpr
<html>
<head>
<meta name="flexible" content="initial-dpr=1" />
</head>
<body>
</body>
</html>
原lib-flexible框架的自适应宽度最大固定为540，超出此宽度的设备将不再继续放大Root Font Size，现可自定义此宽度值。
<html>
<head>
<meta name="flexible" content="initial-dpr=1, max-width=1000" />
</head>
<body>
</body>
</html>
FAQs
Flexible plugin for mobile adaptation
We found that flexible-mobile demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Multiple high-impact npm maintainers confirm they have been targeted in the same social engineering campaign that compromised Axios.
Security News
Axios compromise traced to social engineering, showing how attacks on maintainers can bypass controls and expose the broader software supply chain.
Security News
Node.js has paused its bug bounty program after funding ended, removing payouts for vulnerability reports but keeping its security process unchanged.