如何在垫高按钮上添加边框？

Question

下面的代码不起作用。 我尝试对没有'mat-raised-button'属性的按钮使用相同的样式，并且它可以工作，所以我认为这可能是一个问题。

如何为边框按钮添加边框和边框颜色？

add.html

<button mat-raised-button class="light-button" [routerLink]="[addLink]">
   Add
</button>

styles.css

.light-button {
    height: 50px; 
    width: 150px;
    font-size: 110%;
    border-style: solid;
    border-color: blue;
    background-color: white;
}

Answer 1

您应该将样式添加到组件的CSS中，或者如果要设置为全局style.css，则应使用!important覆盖材质样式：

.light-button {
    height: 50px; 
    width: 150px;
    font-size: 110%;
    border: 2px solid blue !important;
} 

演示🚀🚀