本文主要是介绍sass px转vw,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
如今移动端对 vw/vh 的尺寸单位基本兼容,对代码有洁癖的开发者们不想用js去计算rem的值了。
网上有许多有关在 sass 中 px转rem的文章了,今天小编带来一个简单实用的 px转vw的方法
sass方法源码
/*750:设计稿宽度$px:元素在设计稿上的宽度
*/@function px2vw($px) {@return $px/750*100vw;
}
使用方式
由上图所示,750px的设计稿上有一个375px的元素,通过计算,就是50vw的值啦。这与使用rem和rpx这类单位是一样的。
小编不建议对设计稿上小于5px的元素动态计算,意义不大。特别是1px的线,不能通过该方法计算,因为计算后的结果是小于 1px,在理论上这不是一个合理的值,有些开发者也会写1rpx,这其实也是不对的。
若你仍然喜欢用rem,小编给你rem全套服务,点击下方连接获取:
rem兼容:https://mydarling.gitee.io/resource/author/mobileAdapt.html
作者:黄河爱浪 QQ:1846492969,邮箱:helang.love@qq.com
公众号:
web-7258
,本文原创,著作权归作者所有,转载请注明原链接及出处。更多精彩文章,请扫下方二维码关注我的公众号
这篇关于sass px转vw的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!