1. 先下载一个淘宝的js(/mtb/lib-flexible/0.3.4/??flexible_css.js)
用法说明:
我这里用的scss,当然没用这些样式预处理器也没关系,下面会让你怎么做,因此需定义转换函数
$w: 75; //psd 设计图尺寸除以10@function rem($n) {@return ($n/$w) + rem;}
$w 说明:
1.该为设计图页面总宽度尺寸除以10
3. 接着用法:
.main{
width: rem(700); //某个main类的宽度在设计图是700px。
font-size: rem(28); //我这里为了偷懒,直接用rem去写。但值得注意的是
//所有关于字体的行高line-height, font-size 都需要在设计图原有的尺寸+4.
//譬如 字体在设计图是24px,而用rem去转换时,需要 24+4也就是 rem(28)
//为何+4?因为放手机大小,具体+多少,自己来定,但是+4是最合理,因为和设计图的字像素一毛一样
}
4. 完蛋,我是新手,没用scss,sass等预处理器怎么办??
给个建议,先去学下scss语法,非常简单,类似搬砖工作。
接着点击这个网址 /
如果这个网址打不开,自己搜下翻译工具吧
把scss代码粘贴这个网站左边框,右边就会编译成css的代码咯