插值怎么用

来源:4-17 [Sass]插值#{}

xiangxiangw29

2017-09-06 09:21

$pro: (max,min,line); @mixin height($set,$value){    @each $pr in $pro {        #{$pr}-#{$set}: $value;    } } .box{    @include height(height,200px); } 编译后:.box {  max-height: 200px;  min-height: 200px;  line-height: 200px; } 我就想知道@mixin里的两个参数到底什么意思,传三个就不行,到底是怎么用

写回答 关注

2回答

  • kunkka_l
    2017-09-08 17:26:11

    $pro: (max,min,line); @mixin height($set,$value,$value2)

    {

      @each $pr in $pro

     { 

       #{$pr}-#{$set}: $value+$value2;


      } 

    .box{ @include height(height,200px,50); } 
    经过测试 可行 结果是

    .box {

      max-height: 250px;

      min-height: 250px;

      line-height: 250px; }

     不过我这个写法没啥意义

  • kunkka_l
    2017-09-08 16:43:54

    $pro: (max,min,line); 就是一个数组,数组里面是需要的属性  如果只需要max-height 则可以写为$pro: (max)
    @mixin height($set,$value) 定义一个函数 $set 是键 $value 是值
     height(height,200px);调用函数(键是 height 值是200) 如果改为  height(width,200px); 编译后的结果就是 max-width:200px
    min-width:200px line-height:200px
    至于三个没工具没法测试 可以试着 定义一个有三个变量的函数 调用一下测试 

Sass入门篇

Sass入门视频教程,学会Sass使你摆脱重复编写代码的工作

104420 学习 · 263 问题

查看课程

相似问题