테스트를 깜빡 깜빡 하게 하는 효과

텍스트 깜박이는 효과 만들기이다

jquery,자바스크립트 등으로 만들수 있지만

CSS로 간단하게 만드는 방법이다

 

class="red_to_blue" 선언만 하면 적용된다

<style>
/**************** 빨강 파랑 텍스트 교체 ******************/
.red_to_blue{
-webkit-animation:blink 0.3s ease-in-out infinite alternate;
  -moz-animation:blink 0.3s ease-in-out infinite alternate;
  animation:blink 0.3s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0;color:#ff3300;}
    100% {opacity:1;color:#0000ff;}
}
@-moz-keyframes blink{
    0% {opacity:0;color:#ff3300;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:1;color:#ff0000;}
    100% {opacity:1;color:#0033ff;}
}
/**************** 빨강 파랑 텍스트 교체 ******************/
</style>
<div class="red_to_blue">빨강파랑으로 텍스트가 깜밖입니다</div>