PhoneGap中文网

 找回密码
 立即注册
查看: 33437|回复: 3
打印 上一主题 下一主题

ionic3自适应问题

[复制链接]

1

主题

3

帖子

13

积分

新手上路

Rank: 1

积分
13
跳转到指定楼层
楼主
发表于 2017-12-25 13:47:00 | 只看该作者 回帖奖励 |正序浏览 |阅读模式
ionic3中发现默认1rem=12px;我在asset中引入了以前做自适应的一段代码
(function (doc, win) {
    var docEl = doc.documentElement,
        resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
        recalc = function () {
            var clientWidth = docEl.clientWidth;
            if (!clientWidth) return;
            if (clientWidth<=320){
                docEl.style.fontSize = '6px';
            }
            else if(clientWidth>=640){
                docEl.style.fontSize = '12px';
            }
            else{
                docEl.style.fontSize = 12 * (clientWidth / 640) + 'px';
            }
        };
    if (!doc.addEventListener) return;
    win.addEventListener(resizeEvt, recalc, false);
    doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);


启动项目之后,发现只有字体可以进行自适应,然后设置了div的height: 5rem,随着窗口变换还是保持在60px的高度,如何让高度进行自适应
回复

使用道具 举报

1

主题

3

帖子

13

积分

新手上路

Rank: 1

积分
13
地板
 楼主| 发表于 2017-12-27 08:42:53 | 只看该作者
ionicwang 发表于 2017-12-26 17:13
pc端浏览器最小支持的字体就是12px,你可以不用管,放在手机就正常了

谢谢啊!我改成超过12的值,div盒子就可以自适应了
回复 支持 反对

使用道具 举报

1

主题

3

帖子

13

积分

新手上路

Rank: 1

积分
13
板凳
 楼主| 发表于 2017-12-27 08:42:35 | 只看该作者
ionicwang 发表于 2017-12-26 17:13
pc端浏览器最小支持的字体就是12px,你可以不用管,放在手机就正常了

谢谢啊!我改成超过12px的值,div盒子就可以自适应了
回复 支持 反对

使用道具 举报

11

主题

529

帖子

1418

积分

金牌会员

Rank: 6Rank: 6

积分
1418
沙发
发表于 2017-12-26 17:13:40 | 只看该作者
pc端浏览器最小支持的字体就是12px,你可以不用管,放在手机就正常了
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

站长推荐 上一条 /1 下一条

ionic4视频教程

Archiver|手机版|小黑屋| PhoneGap中文网 ( 京ICP备13027796号-1 )  

GMT+8, 2024-12-23 07:58 , Processed in 0.031209 second(s), 27 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表