开发者

How to += in SCSS?

Does anyone know how to += with SCSS开发者_开发知识库?

Example:

.example {
    padding: 2px;
    &:hover {
        padding: current_padding + 3px; // OR
        padding+= 3px                   //... something like this
    }
}

I'm trying to get .example:hover to have 5px padding.


I don't think there's a way to do exactly what you want to in SCSS, but you could achieve the same effect by using variables:

SCSS

.example {
    $padding: 2px;
    padding: $padding;
    &:hover {
        padding: $padding + 3px;
    }
}

Compiles to

.example { padding: 2px; }
.example:hover { padding: 5px; }

See the documentation on variables and number operations.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜