Learn how to create Timeline Design For Website Using HTML & CSS, Web Design With Animation Using HTML And CSS for beginners #cssanimation #webdesign #website

❤️ SUBSCRIBE: https://goo.gl/tTFmPb

In this video we will learn to make a timeline design for website using HTML and CSS. In this timeline design I have added some animation using CSS. When I scroll the website you can see the vertical line moves downwards. Then it display the each content one by one with animation.

This web design is responsive from small screen devices, you can see it looks good in small screen also. So we will make this Animated vertical timeline website design step by step using HTML and CSS

Download Image: https://drive.google.com/file/d/10nxi26lU1MlesfFrIAzc_7SIvYztllSK/view?usp=sharing

—————————————–
Suggested Course:

❤️ Complete website Using HTML and CSS
✔️ 8 Complete website step by step
✔️ Source Code Download
✔️ 76 Lectures, 12 Hours Video
✔️ Course Completion certificate
👉 https://easytutorialspro.com/go/course/

————————————-
Recommended Videos:

Learn Complete HTML and CSS from basics:
► https://www.youtube.com/playlist?list=PLjwm_8O3suyO2gdXdWHKgM-mO2Y251zzU

Make A Complete Website for college using HTML & CSS:
► https://www.youtube.com/playlist?list=PLjwm_8O3suyP5kGKmwS_DM0Hs1j7fshi5

How to make a Business website step by step:
► https://www.youtube.com/watch?v=99vHH_6F0Ko

How to make personal resume website step by step:
► https://www.youtube.com/watch?v=qCFN8EujbGI

How to make fitness website design using HTML CSS:
► https://www.youtube.com/watch?v=4bPABX-jOko

How to make an Ecommerce Website Design:
► https://www.youtube.com/playlist?list=PLjwm_8O3suyM_2Lo9aAIw3HqjOPor8j9g

How to make a Job Portal website design with HTML & CSS:
► https://www.youtube.com/watch?v=cHgx8a-eBDQ

How to make travel website design with HTML CSS Bootstrap:
► https://www.youtube.com/watch?v=AiaEqc9UMf8

————————————-

Affordable web hosting (coupon- EASYTUTORIALS)
👉 https://easytutorialspro.com/hosting/

My recommended tools and tutorials
👉 https://easytutorialspro.com/

————————————-

◼️ Source code link is shared in community post for all my coding videos exclusively for channel members (only channel members can see)
Join Channel Membership:
► https://www.youtube.com/channel/UCkjoHfkLEy7ZT4bA2myJ8xA/join

————————————-
Images Credit:
https://www.pexels.com/

————————————-
Like – Follow & Subscribe us:

◼️ YouTube: https://goo.gl/tTFmPb
◼️ Facebook: https://goo.gl/qv7tEQ
◼️ Twitter: https://twitter.com/ItsAvinashKr
◼️ Instagram: https://instagram.com/iamavinashkr/

source

38 Comments

  1. Really cool vid, I was assigned to follow along to it for Coding class in school. Definitely recommend if you are into coding and writing, this was very fun.

  7. When creating the line using timeline::after, nothing shows up on my screen? Everything else has worked perfectly, so thank you for that! Am I potentially doing something wrong? here is my code ..

    .timeline::after{
    content: '';
    position: absolute;
    width: 6px;
    height: 100%;
    background-color: white;
    top: 0;
    left: 50%;
    margin-left: -3px;
    z-index: -1;
    }

Leave A Reply

Please enter your comment!
Please enter your name here