1. rem 就是页面根元素的font-size

获取页面宽度，将根元素的字号设置为页面宽度，从而动态的使一个rem为当前页面宽度

2. 使用sass px2函数

npm config set registry https://registry.npm.taobao.org/

touch ~/.bashrc

echo 'export SASS_BINARY_SITE="https://npm.taobao.org/mirrors/node-sass"' >> ~/.bashrc

source ~/.bashrc

npm i -g node-sass    //上面是设置使用淘宝的源

mkdir ~/Desktop/scss-demo

cd ~/Desktop/scss-demo

mkdir scss css

touch scss/style.scss

start scss/style.scss

node-sass -wr scss -o css

3. 在sass中使用px2函数

@function px( $px ){

@return $px/$designWidth*10 + rem;

}

$designWidth : 640; // 640 是设计稿的宽度

/*······上面是px2函数。下面就可以使用这个函数，而不用一直计算rem了····*/

child{

width: px(320);

height: px(160);

}