Daily happenings, XHTML, CSS, MT, WP, Web, a memo, etc…

CSSでテキスト点滅

CSSでテキストを点滅。

HTML

<p class="blink">点滅させたいテキスト</p>

CSS

.blink{
 -webkit-animation:blink 1.5s ease-in-out infinite alternate;
 -moz-animation:blink 1.5s ease-in-out infinite alternate;
 animation:blink 1.5s ease-in-out infinite alternate;
}

@-webkit-keyframes blink{
 0% {opacity:0;}
 100% {opacity:1;}
}

@-moz-keyframes blink{
 0% {opacity:0;}
 100% {opacity:1;}
}

@keyframes blink{
 0% {opacity:0;}
 100% {opacity:1;}
}