我目前使用以下语法将状态颜色嵌入到jsx。
<div className="preview-box" style={{backgroundColor:this.state.color}}>
有没有办法在css中使用lighten功能做这样的事情?
<div className="preview-box" style={{backgroundColor: lighten(this.state.color, 15%)}}>
答案 0 :(得分:0)
您可以使用SCSS
获取backgroundColor: lighten(this.state.color, 15%)
css part
$awesome-blue: #2196F3;
$width: 100%;
$height: 500px;
.box {
background: lighten($awesome-blue, 10%); /* As your need */
width: $width;
height:$height;
display:flex;
align-items:center;
justify-content:center;
}
我发布了一个例子,说明它的工作原理可能会对你有所帮助
<强> Working fiddle with scss 强>