html字体颜色循环变换,使用CSS3循环动画文本颜色更改

使用关键帧和动画属性

HTML

Lorem ipsum dolor sit amet,consectetur adipisicing elit. Qui ad quos autem beatae nulla in.

CSS

p{

-webkit-animation: color-change 1s infinite;

-moz-animation: color-change 1s infinite;

-o-animation: color-change 1s infinite;

-ms-animation: color-change 1s infinite;

animation: color-change 1s infinite;

}

@-webkit-keyframes color-change {

0% { color: red; }

50% { color: blue; }

100% { color: red; }

}

@-moz-keyframes color-change {

0% { color: red; }

50% { color: blue; }

100% { color: red; }

}

@-ms-keyframes color-change {

0% { color: red; }

50% { color: blue; }

100% { color: red; }

}

@-o-keyframes color-change {

0% { color: red; }

50% { color: blue; }

100% { color: red; }

}

@keyframes color-change {

0% { color: red; }

50% { color: blue; }

100% { color: red; }

}