如何将CSS应用于制表符中的工具提示

Question

我希望我的Tabulator表将CSS应用于悬停在单元格上方时出现的工具提示。每当用户设置[tooltips：true]时，制表器都会添加一个[title]标签。但是，内联应用CSS很有挑战性。我做到了：

div[title]:hover:after {
    content:attr(title) ;
    width: 300px ;
    background-color: black ;
    color: #fff ;
    text-align: center ;
    border-radius: 6px ;
    padding: 5px 0 ;

    /* Position the tooltip */
    top: 100%;
    left: 50%;
    margin-left: -60px;
    z-index: 1 ;
}

我还没有确定位置或确定样式。从下图可以看到当我将鼠标悬停在左上方的单元格上时会发生什么。

我有两个工具提示-默认提示和我的自定义提示。此外，自定义工具提示会在单元格边缘停止。

Answer 1

制表器使用HTML title属性显示工具提示，因此样式取决于浏览器，并且用户无法自定义。

如果您想要自定义工具提示，那么我建议使用Custom Formatter添加第三方工具提示生成插件。