CSS:텍스트 흐림 효과

561 단어 Html/Css
오늘 인터넷에서 js의 특수효과, 문자 모호 효과를 보았는데 원 코드를 보니 사실 매우 간단하다. 전체 효과는 두 부분으로 구성된다.
1. 기본 스타일을 설정하고 문자 속성이 투명하며 음영을 넣는다. 이것이 바로 모호 효과이다.
h1 {
color: transparent;
text-shadow:2px 2px 12px #000000;
}

2. 마우스를 띄우고 문자에 색을 추가하면 그림자 면적이 작아진다.
h1:hover {
color: #000000;
text-shadow:0px 0px 3px #000000;
}

소스 파일은 다음과 같습니다.







좋은 웹페이지 즐겨찾기