이미지에 마우스를 올리면 글꼴을 표시하는 방법은 무엇입니까?

이 글에서 수행할 작업은 이미지 위에 마우스를 올렸을 때 글꼴을 표시하는 방법입니다. 이 기사를 자세히 살펴보고 HTML의 hover 및 mouseover에 대해 간단히 살펴보겠습니다.

HTML의 onmouseover 이벤트는 마우스 포인터가 요소에 닿을 때 트리거됩니다. 마우스 포인터가 요소를 벗어나면 onmouseout이라는 이벤트가 발생합니다.

:hover CSS 의사 클래스는 사용자가 포인팅 장치를 사용하여 요소와 상호 작용할 때 일치하지만 항상 활성화되는 것은 아닙니다. 일반적으로 사용자가 요소(마우스 포인터) 위에 커서를 올리면 활성화됩니다.

문법

다음은 hover -

이미지 위로 마우스를 가져갈 때 표시되는 글꼴을 더 잘 이해하려면 다음 예를 살펴보겠습니다.

예

아래 예에서는 이미지 위에 마우스를 올리면 글꼴이 표시되도록 설정했습니다.

스크립트가 실행되면 웹페이지에 이미지를 표시하는 출력이 생성됩니다. 사용자가 이미지 위로 마우스를 가져가면 페이지에 해당 특정 이미지에 대한 텍스트 설명이 표시됩니다.

예

아래 예에서는 이미지 위에 마우스를 올렸을 때 글꼴이 나타나도록 하고 이미지 전체를 덮도록 했습니다.

위 스크립트를 실행하면 웹페이지에 이미지를 출력하는 출력창이 뜹니다. 사용자가 이미지 위로 마우스를 이동하면 전체 이미지를 덮는 텍스트가 표시됩니다.

예

다음 코드를 실행하고 이미지 위에 마우스를 올렸을 때 글꼴이 어떻게 나타나는지 관찰하세요.

스크립트가 실행되면 출력창이 팝업되어 웹페이지에 이미지가 원으로 표시됩니다. 사용자가 이미지 위로 마우스를 가져가면 텍스트가 표시됩니다.

위 내용은 이미지에 마우스를 올리면 글꼴을 표시하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!