为什么我的Angular Material按钮和链接带有下划线/轮廓线？

Question

单击按钮后，我遇到了一些奇怪的概述，该按钮使用了Angular Material的mat-button的任何变体，以及将鼠标悬停在链接标签上时带下划线的链接标签。

Button oulining after the button is clicked.

Link underlining when mouse hovering.

我正在使用Angular 6，Angular Material和一些Bootstrap4。上面图像的代码就是这样：

<div class="container">
    <div class="row">
        <h1>Hello</h1>
    </div>
    <div class="row">
        <button mat-raised-button>Click me!</button>
        <a mat-button>Click me too!</a>
    </div>
</div>

Answer 1

在发布问题时，我发现问题出在Bootstrap，但我决定以任何一种方式发布问题，以记录这种行为。

为了解决此问题，请删除Bootstrap或遵循here中所述的内容。当帖子的作者创建两个Sass部分_variables.scss和_reset.scss时，将描述该解决方案。

关于使用Bootstrap和Angular Material here，还有另一本很好的指南。