How to blink text in HTML using CSS

How to blink text in html using css

How to blink text in HTML using CSS ?

How to blink text in HTML using CSS:-  Hi Readers, In this blog I will demonstrate to you that how we can blink text in HTML using CSS.

Some days before we can blink text in HTML using <blink> tag of HTML, Now these option has been depreciated but no need to worry. We can do the same thing by using CSS code :).

Css Code for Blink text

<style>
.blink {
  animation: blink-animation 1s steps(5, start) infinite;
  -webkit-animation: blink-animation 1s steps(5, start) infinite;
}
@keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
@-webkit-keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
</style>

Just Copy this code and paste the code after <head> in HTML code

HTML Code to blink Text :-

<!doctype html>

<html>
<head>
<title>  blink text  html using css</title>
<style>
.blink {
  animation: blink-animation 1s steps(5, start) infinite;
  -webkit-animation: blink-animation 1s steps(5, start) infinite;
}
@keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
@-webkit-keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
</style>
</head>
<body>
<p class="blink">I want to blink this text</p>
</body>

</html>

Now after executing this code in the browser.The text will start blinking on user’s browser screen.

You can blink so many texts in HTML using CSS code, which I have explained you below this line.

<html>
<head>
<title>  blink text  html using css</title>
<style>
.blink {
  animation: blink-animation 1s steps(5, start) infinite;
  -webkit-animation: blink-animation 1s steps(5, start) infinite;
}
@keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
@-webkit-keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
</style>
</head>
<body>
<p class="blink">I want to blink this text</p>


<h1 class="blink">I want to blink this text</h1>

<span class="blink">I want to blink this text</span>


</body>

</html>

I hope you would like this post ” How to blink text in HTML using CSS” and also comment your feedback and problem if any come.

 

Feedback

I hope you enjoyed this post about  How to blink text in HTML using CSS and provide your valuable feedback and share your problem in Technical Forum.

Leave a Comment