- 34
- 0
一般手机都是设置rem为单位 。
在使用Ant Design Mobile 开发,在项目字体要怎么设置?
有人说在public/index.html设置如下,然后在组件用就以1rem =100px 为基准来设置。
(function (baseFontSize, fontscale) {
var _baseFontSize = baseFontSize || 100;
var _fontscale = fontscale || 1;
var win = window;
var doc = win.document;
var ua = navigator.userAgent;
var matches = ua.match(/Android[\S\s]+AppleWebkit\/(\d{3})/i);
var UCversion = ua.match(/U3\/((\d+|\.){5,})/i);
var isUCHd = UCversion && parseInt(UCversion[1].split('.').join(''), 10) >= 80;
var isIos = navigator.appVersion.match(/(iphone|ipad|ipod)/gi);
var dpr = win.devicePixelRatio || 1;
if (!isIos && !(matches && matches[1] > 534) && !isUCHd) {
// 如果非iOS, 非Android4.3以上, 非UC内核, 就不执行高清, dpr设为1;
dpr = 1;
}
var scale = 1 / dpr;
var metaEl = doc.querySelector('meta[name="viewport"]');
if (!metaEl) {
metaEl = doc.createElement('meta');
metaEl.setAttribute('name', 'viewport');
doc.head.appendChild(metaEl);
}
metaEl.setAttribute('content', 'width=device-width,user-scalable=no,initial-scale=' + scale + ',maximum-scale=' + scale + ',minimum-scale=' + scale);
doc.documentElement.style.fontSize = _baseFontSize / 2 * dpr * _fontscale + 'px';
window.viewportScale = dpr;
})();
if(!window.Promise) {
document.writeln('<script src="./js/es6-promise.auto.min.js"'+'>'+'<'+'/'+'script>');
}
请问这样合理吗?可以适配各种手机吗?
0
打赏
收藏
点击回答
- 共 0 条
- 全部回答
-
许我一个天亮 普通会员 1楼
在React Dva中使用Ant Design Mobile开发,在项目中字体设置可以通过CSS来实现。
- 首先,你需要在你的CSS文件中引入Ant Design Mobile的CSS文件。如果你使用的是HBuilder X,可以在你的项目中引入HBuilder X的CSS文件。如果你使用的是Vue CLI,可以在你的项目中引入Vue CLI的CSS文件。
css @import 'antd/dist/antd.css';- 然后,你可以使用
antd-pro来使用Ant Design Mobile的组件。如果你使用的是HBuilder X,你可以使用@import 'antd-pro/dist/antd-pro.css'来引入antd-pro的CSS文件。
css @import 'antd-pro/dist/antd-pro.css';- 在你的组件中,你可以使用
<style>标签来引入你的CSS文件。如果你使用的是HBuilder X,你可以使用<style>标签来引入antd-pro的CSS文件。如果你使用的是Vue CLI,你可以使用<style>标签来引入你的CSS文件。
```css
```
以上就是在React Dva中使用Ant Design Mobile开发,在项目中字体设置的步骤。
更多回答
网站公告
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部
