首页 > 移动端单位rem和px混合使用问题

移动端单位rem和px混合使用问题

如图

我们开发是字体默认使用px 而其他单位使用的是rem,那么我就产生疑问了。
在竖直高度上来看, 已上图为例:
因为已经给出左侧图片的详细参数,所以高度固定,则为 1.82rem(我们设置1rem ==font-size:100px),
而中间部分的文字,就会不太好 控制,比如 4个间距分别是 .36rem, .14rem , .16rem, 36rem 那么在加上文字 高度(xx)px 那么重高度肯定不会是1.82rem。导致在不同大小显示器上文字偏移以及和图片相对位置偏移。 我当时的做法是对中间文字部分的间距自己做了调整,就是说 .14rem和.16rem我并没有按照设计稿的尺寸做,那样看起来才更合适,但是脱离设计稿的尺寸,我的自己做法肯定不太可取。

所以我想知道,在这种情况下应该怎么处理 ,
是应该中间位置的文字跟随图片的大小和尺寸(即总高度固定),
还是应该先控制好中间部分文字,再让控制图片(即总高度先不固定),
或者说字体用px单位会更好一点,还是有其他跟好的解决办法。

还有 我们的设计师在给出文字之间的行间距是这样的:

紧贴着上下两行来测量高度,而我再开发的时候,比如下图,明显“2个回答”字样距离span标签顶和底都略有间隙,在a标签和p标签下字体越大越明显,这样在我开发的时候就很难给出每一个距离准确的数字。

所以我想知道  这样的问题我应该怎么处理  或者说UI不应该这样给我标注尺寸

根据你的描述,你们移动端的适配采用的是media query的方案

移动端的设计稿一般是给iphone6的750*1334

将设计师给你的尺寸转为rem,全部都用rem,文字字体大小,行距等等

下面说的行距的问题其实很好解决,多行文本,从某行字的最上沿到下一行字的最上沿就是准确的行距(px)啦,你再转为rem就好了

【热门文章】
【热门文章】