Dưới đây là hướng dẫn các bạn cách tự động thay đổi màu chữ chỉ với css3 rất gọn nhẹ và đẹp mắt.
DEMO
Tự động thay đổi màu chữ chỉ với css3
Cách thực hiện
1- Bạn dán đoạn css sau vào trước thẻ ]]></b:skin>
.auto-text{ color:black; animation:myfirst 15s; animation-iteration-count: infinite; -webkit-animation:myfirst 15s; -webkit-animation-iteration-count: infinite; font-family: Arial; font-weight: bold; font-size:25px; text-decoration: none; text-align:center; } @keyframes myfirst { 0% {color: hsl( 10, 90%, 60% );} 6% {color: hsl( 30, 90%, 60% );} 12% {color: hsl( 50, 90%, 60% );} 18% {color:hsl( 70, 90%, 60% );} 24% {color:hsl( 90, 90%, 60% );} 30% {color:hsl( 110, 90%, 60% );} 36% {color:hsl( 130, 90%, 60% );} 42% {color:hsl( 150, 90%, 60% );} 48% {color:hsl( 170, 90%, 60% );} 54% {color:hsl( 190, 90%, 60% );} 60% {color:hsl( 210, 90%, 60% );} 66% {color:hsl( 230, 90%, 60% );} 72% {color:hsl( 250, 90%, 60% );} 78% {color:hsl( 270, 90%, 60% );} 84% {color:hsl( 290, 90%, 60% );} 90% {color:hsl( 310, 90%, 60% );} 96% {color:hsl( 330, 90%, 60% );} 100% {color:hsl( 350, 90%, 60% );} } @-webkit-keyframes myfirst { 0% {color: hsl( 10, 90%, 60% );} 6% {color: hsl( 30, 90%, 60% );} 12% {color: hsl( 50, 90%, 60% );} 18% {color:hsl( 70, 90%, 60% );} 24% {color:hsl( 90, 90%, 60% );} 30% {color:hsl( 110, 90%, 60% );} 36% {color:hsl( 130, 90%, 60% );} 42% {color:hsl( 150, 90%, 60% );} 48% {color:hsl( 170, 90%, 60% );} 54% {color:hsl( 190, 90%, 60% );} 60% {color:hsl( 210, 90%, 60% );} 66% {color:hsl( 230, 90%, 60% );} 72% {color:hsl( 250, 90%, 60% );} 78% {color:hsl( 270, 90%, 60% );} 84% {color:hsl( 290, 90%, 60% );} 90% {color:hsl( 310, 90%, 60% );} 96% {color:hsl( 330, 90%, 60% );} 100% {color:hsl( 350, 90%, 60% );} }2- Khi sử dụng bạn dùng đoạn HTML theo mẫu sau
<div class='auto-text'>Đoạn chữ cần đổi màu</div>Như vậy là bạn đã có đoạn chữ hay một tiêu đề cần trang trí cho blogspot.