Computer >> Máy Tính >  >> Lập trình >> CSS

Hiển thị nội dung bị tràn khi di chuột qua phần tử có CSS

Để hiển thị nội dung bị tràn khi di chuột qua các phần tử, bạn có thể thử chạy mã sau:

Ví dụ

<!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>