Question

我无法让onsen fab元素改变背景颜色或边框。我正在使用角度2和温泉v2。如果我在浏览器检查器中取消选中fabs默认css，我会看到我的css已应用。我已经尝试了！重要。

这是我的css

.main-counter-remove{
    text-align: center;
    font-weight:bold !important;
    color: #d9534f !important;
}

.main-counter-add{
    text-align: center;
    font-weight:bold !important;
    color: #5cb85c !important;

}

.main-counter-remove.fab{
    border: 2px !important;
    border-color: #d9534f !important;
    background-color: white;
}
.main-counter-add.fab{
    border: 2px !important;
    border-color: #5cb85c !important;
    background-color: white;
}

这是我的HTML

        <div class="main-counter-remove">
            <ons-fab modifier="mini" (click)="decrementMainCounter()">
                <span>-</span>
            </ons-fab>
        </div>
        <div class="main-counter">
            <p style="padding:5px">10</p>
        </div>
        <div class="main-counter-add">
            <ons-fab modifier="mini" (click)="incrementMainCounter()">
                <span>+</span>
            </ons-fab>
        </div>

Answer 1

fab类应用于main-content-remove

的子元素

试试

.main-counter-remove .fab/* note the space */
{ 
     /* rules here */
}

如何覆盖onsen ui中的fab element css？

1 个答案: