effects

提供预设视觉效果。

##$embossed-text() 文字浮凸效果。

.blind-embossed {
  $embossed-text(lightblue);
}
.embossed {
  $embossed-text(lightblue, #6699CC);
}
/*编译后*/
.blind-embossed {
  color: #b9deea;
  text-shadow: 0 1px 1px rgba(0,0,0,0.5), 0 -1px 0 rgba(255,255,255,0.5);
}
.embossed {
  color: #69c;
  text-shadow: 0 1px 1px rgba(0,0,0,0.5), 0 -1px 0 rgba(255,255,255,0.5);
}

##$debossed-text() 文字下陷效果。

.blind-debossed {
  $debossed-text(lightblue);
}
.debossed {
  $debossed-text(lightblue, #6699CC);
}
/*编译后*/
.blind-debossed {
  color: rgba(161,210,226,0.8);
  text-shadow: 0 1px 1px #add8e6, 0 0 0 #000, 0 1px 0 rgba(255,255,255,0.8);
}
.debossed {
  color: rgba(91,145,200,0.8);
  text-shadow: 0 1px 1px #add8e6, 0 0 0 #000, 0 1px 0 rgba(255,255,255,0.8);
}

##$stereo-text() 3D文本效果。

.three-d {
  $stereo-text(lightblue, #6699CC);
}
/*编译后*/
.three-d {
  color: #add8e6 #69c;
  text-shadow: 0 1px 0 #86b1bf , 0 2px 0 #7da8b6 , 0 3px 0 #749fad , 0 4px 0 #6b96a4 , 0 5px 0 #527d8b , 0 6px 1px rgba(0,0,0,0.1) , 0 0 5px rgba(0,0,0,0.1) , 1px 1px 3px rgba(0,0,0,0.3) , 3px 3px 5px rgba(0,0,0,0.2) , 5px 5px 10px rgba(0,0,0,0.25) , 0 10px 10px rgba(0,0,0,0.2) , 0 20px 20px rgba(0,0,0,0.15);
}

##$glow-text() 文本发光效果。

.glow-text {
    $glow-text(10px);
}
/*编译后*/
.glow-text {
  text-shadow: 0 0 10px;
}

##$blurry-text() 文本模糊效果。

.blurry {
  $blurry-text(#FFFFFF);
}
/*编译后*/
.blurry {
  color: transparent;
  text-shadow: 0 0 0.15em #fff;
  text-shadow: 0 0 0.15em 0.1px #fff;
}