tooltip-class
时间: 2023-10-16 07:11:39 浏览: 124
bootstrap-tooltip-custom-class:通过添加自定义类来扩展Bootstrap工具提示和Popover。 适用于Bootstrap 3和Bootstrap 4
tooltip-class 是一个 CSS 类,用于定义网页中的提示框(tooltip)。提示框通常用于在鼠标悬停在某元素上时显示相关信息。通过将 tooltip-class 应用于特定的 HTML 元素,可以自定义提示框的样式和行为。
例如,可以使用以下代码来定义和使用 tooltip-class:
CSS:
.tooltip-class {
position: relative;
display: inline-block;
}
.tooltip-class .tooltiptext {
visibility: hidden;
width: 120px;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px;
position: absolute;
z-index: 1;
bottom: 125%;
left: 50%;
margin-left: -60px;
opacity: 0;
transition: opacity 0.3s;
}
.tooltip-class:hover .tooltiptext {
visibility: visible;
opacity: 1;
}
HTML:
<p class="tooltip-class">鼠标悬停在我上面
<span class="tooltiptext">这是一个提示框</span>
</p>
以上代码将创建一个提示框,当鼠标悬停在具有 tooltip-class 类的 `<p>` 元素上时,将显示带有 "这是一个提示框" 文本的样式化提示框。
阅读全文