simple-tooltipmy-content 元素中使用。由于内容就是元素的 children,tooltip 在其 shadowRoot 中渲染了一个 slot。tooltip 默认显示是不正确的,但这样更方便添加样式。要为 tooltip 元素本身添加样式,请将以下属性添加到 simple-tooltip:host 选择器中。

simple-tooltip.

Permalink to "simple-tooltip."
:host {
display: inline-block;
position: fixed;
padding: 4px;
border: 1px solid darkgray;
border-radius: 4px;
background: #ccc;
pointer-events: none;
}

在 Lit 文档中了解更多关于主题化样式设置以及 :host 选择器的内容。

tooltip 应该显示在它所提示的内容之上。使用 position: fixed 会创建一个新的 层叠上下文,在大多数情况下都能正常工作。