摘要:一形式定义一个变量和一个全局基于视觉稿横屏尺寸得出的基准使用示例翻译结果二形式定义一个变量和一个基于视觉稿横屏尺寸得出的基准使用示例翻译结果三形式定义一个变量和一个基于视觉稿横屏尺寸得出的基准使用示例翻译结果
一. less形式
//定义一个变量和一个mixin(全局) @fontSizeBase: 75;//基于视觉稿横屏尺寸/100得出的基准font-size .px2rem(@name, @px){ @{name}: @px / @fontSizeBase * 1rem; } //使用示例: .fontsize { .px2rem(fontsize, 750); } //less翻译结果: .fontsize { font-size: 10rem; }
二. sass形式
//定义一个变量和一个mixin $fontSizeBase: 75;//基于视觉稿横屏尺寸/100得出的基准font-size @mixin px2rem($name, $px){ #{$name}: $px / $fontSizeBase * 1rem; } //使用示例: .fontsize { @include px2rem(height, 750); } //scss翻译结果: .fontsize { font-size: 10rem; }
三. stylus形式
//定义一个变量和一个mixin $fontSizeBase: 75;//基于视觉稿横屏尺寸/100得出的基准font-size px2rem(name, px){ {name}: px / $baseFontSize * 1rem; } //使用示例: .fontsize { px2rem("font-size", 750); } //stylus翻译结果: .fontsize { font-size: 10rem; }
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/117425.html
摘要:一形式定义一个变量和一个全局基于视觉稿横屏尺寸得出的基准使用示例翻译结果二形式定义一个变量和一个基于视觉稿横屏尺寸得出的基准使用示例翻译结果三形式定义一个变量和一个基于视觉稿横屏尺寸得出的基准使用示例翻译结果 一. less形式 //定义一个变量和一个mixin(全局) @fontSizeBase: 75;//基于视觉稿横屏尺寸/100得出的基准font-size ...
摘要:前言自总结完了上篇前端工程化的思想,并在全家桶的项目加以实践,趁热给大家总结一篇如何更有效率与质量地开发项目,以及其中踩过的一个个坑。。。 前言 自总结完了上篇前端工程化的思想,并在vue全家桶的项目加以实践,趁热给大家总结一篇如何更有效率与质量地开发vue项目,以及其中踩过的一个个坑。。。 基于vue-cli的自定义模板(Custom Templates) 小伙伴们的vue项目应该都...
摘要:让我们考虑下场景当使用开发移动端的时候,你定义了一个转的函数或者是网站配色的全局变量等,然后到工程里为每个文件或者组件那得重复做这样的工作很多很多次,万一这些公用文件目录路径变怎么办呢,哭都来不及,想想都觉得恐怖呀接下来拯救我们的神器就要登 让我们考虑下场景:当使用rem/vw开发移动端的时候,你定义了一个px转rem的函数,或者是网站配色的全局变量等,然后到工程里为每个vue文件或者...
阅读 829·2021-11-25 09:43
阅读 3655·2021-11-19 09:40
阅读 853·2021-09-29 09:34
阅读 1749·2021-09-26 10:21
阅读 845·2021-09-22 15:24
阅读 4141·2021-09-22 15:08
阅读 3224·2021-09-07 09:58
阅读 2563·2019-08-30 15:55