css - 样式化 md-tooltip(Angular Material 1.1.3)

Question

我有一个 mat-tooltip，我正在通过这样的 CSS 设置样式:

mat-tooltip .mat-content {
    // custom values, styling is not applied
}

然而，自从 1.1.2 版本发布 Angular 形 Material 以来，这种样式并未应用于我的工具提示。有没有人遇到过类似的问题？

Answer 1

如果您想设置所有工具提示的样式，只需覆盖.md-tooltip 类:
( JsFiddle )

.md-tooltip {
    height: 35px !important;
    background-color: red !important;
    color: white !important;
    border-radius: 5px;
}

---

如果您想要特别设置一些工具提示的样式，请在 md-tooltip 元素上使用自定义类:
( jsFiddle )

HTML

<md-tooltip class="custom-tooltip">
    I'm a custom tooltip
</md-tooltip>

CSS

.custom-tooltip {
  top: 25px !important;
  height: 35px !important;
  background-color: red !important;
  color: white !important;
  border-radius: 5px;
}