为什么本来从设计稿上测量是100px,实际却用50px?

为什么本来从设计稿上测量是100px,实际却用50px?

视频里面用的导航条是高度,测量出来时750px,但是实际用的是50px。

是不是将设计稿等比缩放到375px的结果?还是其他什么原因?

为什么设计师不直接按照375px来出设计稿呢? 还有设计师一般是以CSS像素为基准来设计的,还是物理像素来设计的?

麻烦解答, 谢谢。 如果不是老师,请不要回答, 以免浪费大家的时间。

正在回答

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

2回答

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

  1. 设计稿是按照设备的屏幕分辨率(物理像素)所给的。例如750px是iphone6的物理像素,由于iPhone6的dpr为2,即一个css逻辑像素占两个物理像素,所以在设置高度时除以2。

  2. 设计稿一般都是按照设备的分辨率去设置。如果直接给css像素的,即设计稿是375px,这样也可以直接量多少写多少,也能完美适配,但这个完美适配只对于一个设备,即iPhone6。那么在其它设备中还是不能适配。

    所以我们在做移动端的时候,并不会使用固定单位px,而是使用rem。视频中老师也简单的示范了一下,高度100px转换为0.13333..rem。后续课程中就会讲通用视频方案,让页面在不同的设备下自适应,所以在去做页面的时候,就按照750px的设计稿去做即可。建议同学先继续往下看完整个课程。

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

如果我的回答帮助到了你,欢迎采纳,祝学习愉快~

  • 慕移动3569406 提问者 #1
    谢谢, 有个意见我想反馈一下,有的时候,我们发起的问题,会有一些不是助教老师的来回答,它们这一回答吧,助教老师就不管了,我觉得这样是浪费学生的时间。因为要的答案就是像您这样专业有权威的答案,而且助教们的回答问题的初心就是为了学生能够理解和解决问题,可其他人的目的我就不清楚了,有的要么冷嘲热讽,要么自以为抖出了什么高深的见解,回答起来也颇不耐烦,这要是他答了一半,就不答了,这不是浪费大家的时间嘛?(以上不是针对助教老师们 orz),个人觉得至少助教老师也能多关注一下一些近期未采纳的问题。 这个问题就是我前段时间问的,我希望能有助教来帮忙回复一下疑问,谢谢: https://class.imooc.com/course/qadetail/208982 其实就是想问问这个兼容性的问题, 是怎么判断的。
    2020-03-31 18:44:05
好帮手慕夭夭 2020-03-31 19:39:43

同学你好,不要着急,并不是别人回答了老师就不管了哦。每一个问题我们都会查看的,如果同学们回答中存在问题,老师们会去纠正。如果说同学们的回答是对的,老师们就不会再重复说了哦。问答区不仅仅是老师为同学回答问题,同时我们也非常鼓励同学与同学之间的互相帮助。这样不仅能锻炼自己能力,还能帮助到其他小伙伴。像这样同学就很热心,而且回答的也很认真。当然了,同学反馈的问题老师们以后会多注意,如果其他同学回答了,老师们也会给予一个肯定,让同学能够安心采纳。

关于同学回复中的提问,这位同学说的是对的,没有这样的网站哦。如果想知道某一个浏览器是否淘汰,可以去网上查一下。当然了,那些前端工程师所说,具体是道听途说还是有相关依据,这个老师也不太好判断。也许人家是听一些级别更高工程师说的,也许是他自己从网上获取的相关信息。同学也不需要太担心,一般在实际开发中,大多数考虑主流浏览器就行(就是常见的一些),如 ie ,firefox, chrome, safari ,360。

祝学习愉快 ~

问题已解决,确定采纳
还有疑问,暂不采纳

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

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

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

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

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

在线咨询

领取优惠

免费试听

领取大纲

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