>  기사  >  웹 프론트엔드  >  CSS 마우스 호버 색상 변경: 마우스를 호버하면 하이퍼링크 글꼴 색상이 변경됩니다.

CSS 마우스 호버 색상 변경: 마우스를 호버하면 하이퍼링크 글꼴 색상이 변경됩니다.

云罗郡主
云罗郡主앞으로
2018-11-22 17:30:5228663검색


이 글의 내용은 CSS 마우스 호버 색상 변경에 관한 것입니다. 하이퍼링크 글꼴은 마우스 호버 색상에 따라 변경됩니다. 필요한 친구들이 참고하면 도움이 될 것입니다. 당신이 도와줬어요.

css는 마우스를 하이퍼링크 위로 가져가면 글꼴 색상이 변경되도록 설정하고, CSS는 마우스를 하이퍼링크 위로 가져가면 색상이 변경되도록 레이아웃을 설정합니다.

글꼴 위에 마우스를 올리면 텍스트 색상이 변경됩니다. 일반적으로 하이퍼링크 앵커 텍스트의 글꼴 색상을 변경하려면 의사 클래스인 hover가 사용됩니다.

a{ color:#00F}
a:hover{ color:#F00}

설명: 기본 하이퍼링크 글꼴 색상은 파란색 "color:#00F"이고 마우스를 가리키면 글꼴 색상은 빨간색 "color:#F00"입니다. 마우스 호버 색상을 변경하려면 a:hover

1, div css 예제 코드

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>鼠标悬停颜色改变 实例</title>
<style>
a{ color:#00F}/* 默认超链接字体颜色为蓝色 */
a:hover{color:#F00}/* 默认超链接字体悬停时颜色为红色 */
.zhiding a{ color:#090}
.zhiding a:hover{ color:#F0F}
</style>
</head>
<body>
<p>欢迎来到<a href="http://www.php.cn/">php</a>学习php技术!</p>
<p class="zhiding">指定对象<a href="#">超链接</a>字体悬停颜色改变!</p>
</body>
</html>

를 설정하면 효과는 다음과 같습니다.

CSS 마우스 호버 색상 변경: 마우스를 호버하면 하이퍼링크 글꼴 색상이 변경됩니다.

지침:

1), 기본 웹 페이지 설정 하이퍼링크 글꼴은 파란색으로, 마우스 호버는 중지되면 빨간색입니다(a{ color: #00F} a:hover{color: #F00}) ). 동시에 하이퍼링크의 글꼴 색상도 변경됩니다. 지정된 개체는 기본적으로 녹색으로 설정되어 있으며 마우스를 올리면 글꼴 색상이 분홍색으로 표시됩니다.

3. 요약

css 마우스 오버 색상 변경은 CSS 스타일 변경을 설정하기 위해 하이퍼링크 의사 클래스 ":hover"를 적용합니다. 색상 변경 외에도 마우스 오버 글꼴 크기, 글꼴 굵기, 배경 등을 정의할 수도 있습니다. 스타일 변경을 글꼴로 변경 색상 변경을 유연하게 사용하여 다른 CSS 스타일을 설정할 수 있습니다.

위는 CSS 마우스 호버 색상 변경 구현에 대한 전체 소개입니다.

CSS3 튜토리얼

에 대해 자세히 알고 싶다면 PHP 중국어 웹사이트에 주목하세요.



위 내용은 CSS 마우스 호버 색상 변경: 마우스를 호버하면 하이퍼링크 글꼴 색상이 변경됩니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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