PHP前端开发

使用CSS将鼠标悬停在元素上时显示溢出的内容

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

在悬停在元素上时显示溢出内容,您可以尝试运行以下代码:

示例

实时演示

<!DOCTYPE html><html>   <head>      <style>         div.demo {            white-space: nowrap;            width: 180px;            overflow: hidden;            border: 2px solid blue;        }         div.demo:hover {            text-overflow: inherit;            overflow: visible;         }      </style>   </head>   <body>      <p>Hover to see the complete text below:</p>      <br>      <div class = "demo" style = "text-overflow:clip;">Demo Text that will hide in this box.</div>   </body></html>