码迷,mamicode.com
首页 > 其他好文 > 详细

sass的循环for,while,each

时间:2018-08-31 17:12:09      阅读:153      评论:0      收藏:0      [点我收藏+]

标签:url   str   style   member   check   select   div   each   use   

1. for

@for $i from 1 to 10 {
  .border-#{$i} {
    border: #{$i}px solid blue;
  }
}

2. while

$i: 6;

@while $i > 0 {
  .item-#{$i} { width: 2em * $i; }
  $i: $i - 2;
}

3. each

@each $member in a, b, c, d {
  .#{$member} {
    background-image: url("/image/#{$member}.jpg");
  }
}

/*或者*/

$icon_name:user,pass,checked,select;

@each $i in $icon_name{
  .icon_#{$i}{
    width: 10px;
  }
}

 

sass的循环for,while,each

标签:url   str   style   member   check   select   div   each   use   

原文地址:https://www.cnblogs.com/mengff/p/9566355.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!