疑问

疑问

  1. 是不是我们设置字体大小或者盒子高度的时候不用考虑设备本身的屏幕宽度(因为是适配各种设备的),只需考虑设备的dpr?

    2. 如果750px宽的设计稿字体高度为20px, 是不是不管什么设备,dpr=1的时候,设置字体高度 20px,dpr=2的时候 ,设置字体高度40px? 

正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

4回答
好帮手慕夭夭 2020-12-29 09:31:08

同学你好,是的,如果按照当前例子去做,同学问题中理解的都是对的。祝学习愉快~

好帮手慕夭夭 2020-12-28 18:12:14

同学你好,是的,当前例子中文字不考虑屏幕宽度。祝学习愉快~

  • 提问者 weibo_我是LUFFCIER_0 #1

    ​这样的话,如果设计稿页面宽度750px,字体高10px,当dpr为2的时候,字体高是不是设置为20px?

    2020-12-28 20:58:47
好帮手慕夭夭 2020-12-28 15:39:11

同学你好,问题解答如下:

1、同学所说的老师明白,你是看了如下代码中,是根据不同dpr设置的不同字体大小,所以才觉得字体大小或者盒子的高度不用考虑屏幕宽度的。

http://img1.sycdn.imooc.com//climg/5fe987af0980bc4902930221.jpg

2、虽然这个案例中显示的文字是根据dpr的不同而改变的。但是页面中其他元素的宽高还是根据屏幕变化而变化,建议再看一下本案例,案例中也使用到了通用适配,如下:

http://img1.sycdn.imooc.com//climg/5fe988af09dc109905170173.jpg

通用适配考虑的就是页面随着设备宽度的变化而变化:

http://img1.sycdn.imooc.com//climg/5fe988f6098aca1e13710466.jpg

3、老师是认为文字只考虑dpr,而不考虑屏幕宽度这个说法太绝对了。虽然本案例中只考虑dpr,但是还要考虑实际需求,假如实际需求中,文字不会随着屏幕宽度的变大而变大,缩小而缩小,那么可以不考虑。假如我们的需求是,文字在大屏幕下显示的稍微大一点,小屏幕小显示的稍微小一点,那么此时就要考虑屏幕宽度哦。

祝学习愉快~


  • 提问者 weibo_我是LUFFCIER_0 #1
    我的意思是 本节课中的字体用px设置是不是不考虑屏幕宽度
    2020-12-28 15:41:58
好帮手慕夭夭 2020-12-28 11:14:15

同学你好,问题解答如下:

1、理解的不对。比如dpr相同的设备,但是设备屏幕宽度不一样,那么显示的字体大小肯定要不一样。所以dpr和屏幕宽度都要考虑。

2、理解的不对。就像第一条所说,不能只看dpr,也要考虑设备的宽度。通用视频方案,就要根据不同的屏幕宽度,来设置不同的字体大小。建议同学参考源码或者自己写一下代码测试,如下:

当dpr为1的时候,改变屏幕宽度,字体是不断变化的

http://img1.sycdn.imooc.com//climg/5fe94c7c09e739d211790546.jpg

这就是因为代码中,字体是以屏幕宽度除以固定的系数(即18.75,这个是我们任意设置的,18.75好计算)计算的。

http://img1.sycdn.imooc.com//climg/5fe94ca509b0166e05300086.jpg

祝学习愉快~


  • 提问者 weibo_我是LUFFCIER_0 #1
    但是这节课的字体宽度是采用px单位,而不是rem单位的啊,如果字体是用px作为单位,设计稿页面宽度750px,字体高10px的时候,是不是不用考虑设备屏幕宽度,只需考虑dpr,例如dpr为2的时候,字体高设置为20px?
    2020-12-28 12:36:54
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星

相似问题

登录后可查看更多问答,登录/注册

3.WebAPP开发与小程序
  • 参与学习           人
  • 提交作业       622    份
  • 解答问题       6815    个

微信带火了小程序,也让前端工程师有了更多的展现机会,本阶段带你从移动基础知识的学习到webAPP开发,及小程序开发,让你PC端与移动端两端通吃。

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师