How to create animation using HTML | CBSE Class 10 | Cyber Beans Chapter 3 | HTML | Prakhar Doneria

 

Write this code in HTML 5 editor:



<html>
<head>
<title>Page Title</title>
<style>
*{
    padding:0px;
    margin:0px;
    background-color:black;
}
body {
    height:100vh;
    display:flex;
    box-sizing:border-box;
    justify-content:center;
    align-items:center;
}
h1{
    width:0ch;
    overflow:hidden;
    white-space:nowrap;
    font-family:Sans-serif;
    font-style:armenian;
    letter-spacing:0px;
    font-size:50px;
    animation:html 5s infinite alternate steps(5);
    border-right:3px solid black;
    color:white;
    
}
@keyframes html{
    0%{
        width:0ch;    
}
    10%{
        width:4ch;
}
    20%{
        width:7.5ch;
}
</style>
</head>
<body>
<h1>I❤️HTML</h1>
</body>
</html>




Output: 


Also read:Form by HTML


Comments

Popular posts from this blog

What is a Blogs? How to create account on Blog?

What is JAVASCRIPT?How to make a program using HTML and Java | "Hello World" | Prakhar Doneria

HOW TO ADD PIE CHART IN HTML | PRAKHAR DONERIA