PHP前端开发

使用 CSS 设置顶部工具提示

百变鹏仔 4周前 (09-19) #CSS
文章标签 提示

要设置顶部工具提示,请使用 bottomCSS 属性。

您可以尝试运行以下代码将顶部工具提示设置为文本:

示例

现场演示

<!DOCTYPE html><html>   <style>      .mytooltip .mytext {         visibility: hidden;         width: 140px;         background-color: blue;         color: #fff;         z-index: 1;         bottom: 100%;         left: 60%;         margin-left: -90px;         text-align: center;         border-radius: 6px;         padding: 5px 0;         position: absolute;      }      .mytooltip {         position: relative;         display: inline-block;         margin-top: 50px;      }      .mytooltip:hover .mytext {         visibility: visible;      }   </style>   <body>      <div class = "mytooltip">Keep mouse cursor over me         <span class = "mytext"> My Tooltip text</span>      </div>   </body></html>