更改CSS禁用按钮

Question

问题是禁用了“按钮”，CSS在图标周围应用了框架。如何更改css“ .disable”以避免应用框架。我想创建一个新的类.disable，因为当我禁用按钮时，此CSS很好。

<button class="btn btn-icon button-transparent" (click)="deleteItem()" [disabled]=user.readOnly><i class="fa fa-trash"></i></button>

Answer 1

您可以尝试将类与条件绑定，请参见：

<button class="btn btn-icon button-transparent" 
        [class.disabled]="user.readOnly" 
        (click)="deleteItem()" 
        [disabled]=user.readOnly><i class="fa fa-trash"></i></button>

Answer 2

在按钮上使用disabled属性时，您还可以为已禁用的按钮设置样式。因此，您不必再添加一个条件就可以添加禁用的类。

<button class="btn btn-icon button-transparent" 
    [disabled]="user.readOnly" 
    (click)="deleteItem()"><i class="fa fa-trash"></i></button>

CSS

button:disabled{
  opacity: 0.3;
}