HTML5技术

SASS入门教程及用法指南 - 定乾坤(3)

字号+ 作者:H5之家 来源:H5之家 2016-09-23 12:00 我要评论( )

SASS支持for循环: @for $i from 1 to 10 { . border -#{ $i } { border : #{$i}px solid blue; } } 也支持while循环: $i : 6 ; @while $i 0 { . item -#{ $i } { width : 2em * $i ; } $i : $i - 2 ; } each命令

SASS支持for循环:

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

也支持while循环:

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

each命令,作用与for类似:

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

SASS允许用户编写自己的函数。

@function double($n) {     @return $n * 2;   }   #sidebar {     width: double(5px);   }

阅读原文请点击此处

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • linear-gradient 的“高能”用法 - 冇乜吔

    linear-gradient 的“高能”用法 - 冇乜吔

    2016-03-17 13:00

  • 关于H5 storage 的一些注意事项以及用法 - 求学sql

    关于H5 storage 的一些注意事项以及用法 - 求学sql

    2016-02-25 10:00

  • 再谈Newtonsoft.Json高级用法 - 焰尾迭

    再谈Newtonsoft.Json高级用法 - 焰尾迭

    2016-01-25 12:21

  • html5 图片热点area,map的用法 - 王业楼的个人博客

    html5 图片热点area,map的用法 - 王业楼的个人博客

    2015-11-14 11:27

网友点评
t