스크립트 & 소스코드 공유

• 목록

CSS @keyframes를 이용해 텍스트 색상이 번지듯 변하는 애니메이션 예제다. h2 요소에 animation: spread 1s ease-in-out infinite alternate를 적용하고, @keyframes spread의 to 단계에서 색상을 파란색에서 빨간색으로 전환한다. 제목 텍스트에 간단히 적용할 수 있는 전체 코드를 제공한다.

<style type="text/css">
H2{text-align:center; font-size:5em; color:blue; animation:spread 1s ease-in-out infinite alternate }

@keyframes spread{
to{
color:red;
}
}
</style>

<h2>미래를 향한 기업</h2>