css – 离子2中的背景颜色渐变

我正在尝试使用variables.scss文件中的$background-color变量为我的应用设置背景颜色.只设置一种颜色(如#000或#fff)时这样可以正常工作,但不能使其适用于渐变.

$background-color：线性渐变(到底部,#000 0％,#fff 100％);

此代码抛出以下Sass错误：

‘rgba($color,$alpha)’的参数’$color’必须是一种颜色Backtrace.

那么,如何将背景颜色设置为渐变？

解决方法

这是我用于自己的背景渐变的scss代码.

$SIDEMENU_TOP: #A23C4B;
$SIDEMENU_BOTTOM: #ff9068;
$SIDEMENU_TRANSPARENCY: rgba(255,255,0.4);


.side-menu-gradient{
    background: -webkit-gradient(left top,$SIDEMENU_TOP,$SIDEMENU_BOTTOM);
    background: -o-linear-gradient(bottom right,$SIDEMENU_BOTTOM);
    background: -moz-linear-gradient(bottom right,$SIDEMENU_BOTTOM);
    background: linear-gradient(to bottom right,$SIDEMENU_BOTTOM);
}

(也许来自Ionic Creator – Creating beautiful Sidemenus(YouTube)的高度启发

css – 离子2中的背景颜色渐变

解决方法

相关文章