집 > 기사 > 웹 프론트엔드 > CSS를 사용하여 요소 위로 마우스를 가져갈 때 넘치는 콘텐츠 표시

CSS를 사용하여 요소 위로 마우스를 가져갈 때 넘치는 콘텐츠 표시

WBOY앞으로: 2023-09-12 16:53:021483검색

요소 위로 마우스를 가져갈 때 오버플로 콘텐츠를 표시하려면 다음 코드를 실행해 보세요.

Example

Live Demo

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

위 내용은 CSS를 사용하여 요소 위로 마우스를 가져갈 때 넘치는 콘텐츠 표시의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

css

성명：

이 기사는 tutorialspoint.com에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제

이전 기사：CSS3의 새로운 기능 개요: CSS3를 사용하여 회전 효과를 얻는 방법다음 기사：CSS3의 새로운 기능 개요: CSS3를 사용하여 회전 효과를 얻는 방법