CSS에서 :hover는 마우스 포인터가 가리키고 있는 요소를 선택하는 데 사용되는 의사 클래스 선택기입니다. :hover를 사용하면 사용자가 요소 위로 마우스를 가져갈 때 일부 스타일 변경 사항을 적용할 수 있습니다.
다음은 :hover를 사용하여 링크 색상을 변경하는 방법에 대한 간단한 예입니다.
a { color: blue; } a:hover { color: red; }
이 예에서 사용자가 링크 위로 마우스를 가져가면 링크 색상이 빨간색으로 변경됩니다. 마우스 오버가 없으면 링크 색상은 파란색입니다.
색상 변경 외에도 :hover를 사용하여 배경색, 테두리 스타일, 글꼴 크기 등과 같은 다른 스타일 변경 사항을 적용할 수도 있습니다. 다음은 좀 더 복잡한 예입니다.
button { background-color: lightgray; border: none; padding: 10px 20px; font-size: 16px; } button:hover { background-color: gray; color: white; border: 2px solid white; font-size: 18px; }
이 예에서 사용자가 버튼 위로 마우스를 가져가면 버튼의 배경색이 회색으로 변경되고 텍스트 색상이 흰색으로 변경되며 테두리도 흰색으로 변경됩니다. 18픽셀로 늘어납니다.
위 내용은 CSS에서 호버를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!