Blink Text in CSS – Blink  Heading h1, h2, h3, and paragraph P in CSS 

Blink Text in CSS – Blink  Heading h1, h2, h3, and paragraph P in CSS 

In this tutorial, we will try to learn about the followings;

  1. Blink Heading in CSS
  2. Blink Paragraph in CSS

Blink Heading in CSS

<html>
<head>
<style> 
h1{
    animation:blinkingText 0.1s infinite;
}
@keyframes blinkingText{
    0%{     color: red;    }
    40%{    color: ornage; }
    60%{    color: pink; }
    90%{    color:transparent;  }
    100%{   color: green;    }
}
</style>
</head>
<body>

<h1>T4TUTorials.com</h1>

<p>Special thanks to all of you.</p>

</body>
</html>

Blink Paragraph in CSS

<html>
<head>
<style> 
p{
    animation:blinkingText 0.1s infinite;
}
@keyframes blinkingText{
    0%{     color: red;    }
    40%{    color: ornage; }
    60%{    color: pink; }
    90%{    color:transparent;  }
    100%{   color: green;    }
}
</style>
</head>
<body>

<h1>T4TUTorials.com</h1>

<p>Special thanks to all of you.</p>

</body>
</html>

 

Prof.Fazal Rehman Shamil (Available for Professional Discussions)
1. Message on Facebook page for discussions,
2. Video lectures on Youtube
3. Email is only for Advertisement/business enquiries.