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

WBOY
풀어 주다: 2023-09-13 08:09:02
앞으로
2837명이 탐색했습니다.

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

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

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

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

문법

다음은 hover -

의 구문입니다. 으아아아

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

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

으아아아

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

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

으아아아

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

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

으아아아

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

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

관련 라벨:
원천:tutorialspoint.com
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!