Online HTML & CSS Course (Free)

If you are interested in front-end development but have zero clue, this practical-based course is all you need. Learn the fundamentals of the web and how to build, style, and design eye-grabbing web pages.

What this HTML & CSS course is about

This course will guide you through the fundamentals of HTML and CSS, the essential building blocks of any website. No prior coding experience is needed! We’ll break down complex concepts into easy-to-understand lessons with hands-on exercises to solidify your learning. 

Learn HTML to structure your webpage and add content, then dive into CSS to design its visual style. In this course, you will also learn the essential elements, formatting, and media integration necessary for designing noteworthy web pages. 

To get to every new chapter you will be required to pass a test or quiz. So do not think that this FREE course won’t expect any accountability from you. You must complete the tasks to get to the next chapter. 

By the end of the course, you will also work on multiple hands-on projects like building a resume and a responsive template to test to knowledge. Plus these will be a great add-on to your portfolio.

What you'll learn

Here’s a brief idea of the things you will be learning from this course. 

  • HTML elements, tags, and how to build the foundation of a webpage.
  • CSS syntax, selectors, and properties to control fonts, colors, layouts, and more.
  • Setting up a development environment using the VS Code IDE with helpful extensions.
  • Popular ways to format text, images, and other elements on your webpage.
  • Building links, lists, tables, and forms to add functionality to your website.
  • Integrating images, audio, and video into your web pages.

What’s covered in this online HTML & CSS course

  1. Introduction to HTML – Lessons: 1, Quizzes: 1
  2. vscode IDE and extensions – Lessons: 1, Quizzes: 0
  3. HTML element – Lessons: 1, Quizzes: 1
  4. Basic Page Structure – Lessons: 3, Quizzes: 1
  5. HTML code execution – Lessons: 1, Quizzes: 1
  6. Formatting Page Content – Lessons: 4, Quizzes: 1
  7. Html comments – Lessons: 1, Quizzes: 0
  8. HTML attributes – Lessons: 1, Quizzes: 1
  9. Html images – Lessons: 2, Quizzes: 1
  10. Creating Links – Lessons: 3, Quizzes: 1
  11. Creating Lists – Lessons: 3, Quizzes: 1
  12. Self closing tags – Lessons: 1, Quizzes: 1
  13. Creating tables – Lessons: 3, Quizzes: 1
  14. Using media elements – Lessons: 3, Quizzes: 1
  15. Html forms – Lessons: 4, Quizzes: 1
  16. Introduction to CSS – Lessons: 1, Quizzes: 0
  17. Syntax – Lessons: 1, Quizzes: 0
  18. Executing First CSS Code – Lessons: 1, Quizzes: 1
  19. Types of selectors – Lessons: 1, Quizzes: 1
  20. Simple Selector – Lessons: 2, Quizzes: 0
  21. Combinator Selector – Lessons: 1, Quizzes: 0
  22. Pseudo Class Selector – Lessons: 1, Quizzes: 0
  23. Attribute Selector – Lessons: 1, Quizzes: 1
  24. CSS Comment – Lessons: 1, Quizzes: 0
  25. Color properties – Lessons: 2, Quizzes: 0
  26. Typography – Lessons: 6, Quizzes: 1
  27. Box model – Lessons: 1, Quizzes: 1
  28. Borders – Lessons: 1, Quizzes: 0
  29. Margins – Lessons: 2, Quizzes: 0
  30. Padding – Lessons: 1, Quizzes: 1
  31. Styling navigations – Lessons: 1, Quizzes: 0
  32. Position – Lessons: 7, Quizzes: 1
  33. Overflow – Lessons: 1, Quizzes: 1
  34. Float – Lessons: 1, Quizzes: 0
  35. Important – Lessons: 1, Quizzes: 0
  36. Styling HTML elements – Lessons: 1, Quizzes: 1
  37. Display property – Lessons: 3, Quizzes: 1
  38. Flex – Lessons: 2, Quizzes: 1
  39. Grid – Lessons: 1, Quizzes: 1
  40. Media Queries – Lessons: 2, Quizzes: 1
  41. Project on Resume Building using HTML – Lessons: 1, Quizzes: 0
  42. Project Creating a Favorite Blog – Lessons: 1, Quizzes: 0
  43. Project Registration Page – Lessons: 1, Quizzes: 0
  44. Building a Search box of Google – Lessons: 1, Quizzes: 0
  45. Project Creating a responsive template – Lessons: 11, Quizzes: 0
  46. Assessment To get Certificate – Lessons: 0, Quizzes: 1

About the Trainer


Ravi Siva Ram Teja Nagulavancha

N Ravi Siva Ram Teja is a MERN Stack Developer and Mentor at Codegnan. He holds a BTech degree in computer science and worked for more than 4 years as a full-stack developer and mentor. His knowledge of HTML5, CSS3, Bootstrap, JavaScript, MySQL, and multiple other programming languages and frameworks makes him a great mentor for beginners and professional learners at Codegnan.


Undergraduates with a minimum of 60% in their high secondary (10+2 in any stream) are eligible for this course. Other than that, there are no such prerequisites for this course. 

However, since this course only focuses on HTML and CSS, having prior knowledge of any other programming language like Python or C can help you understand better. 

To do so, you can check out codegnan’s FREE Python and C programming courses.

It is a 60+ hours value-packed course. If you devote atleast 10-12 hours every week, you can comfortably learn all the HTML & CSS concepts in three months or so.

Yes, you will get a shareable online certificate for this course. You just need to finish 75% of the course and the project assignment in the end to receive the certificate.

Anyone who wishes to become a web developer is an ideal candidate for this course. HTML and CSS are essential if you want to become successful, as they build your acumen for learning more complex languages.

Yes, there are a total of 26 tests across 46 modules of this online HTML & CSS course. You need to pass these tests and quizzes to move to the next chapter. This will ensure that you are actually learning and not wasting time sitting in front of your computer.

Yes, the learnings will be useful for getting entry-level front-end development jobs. However, if you want better opportunities codegnan does have its Job Assistance Program where you can get placed in prestigious companies. It is a 100-day intensive training program where you learn the latest requirements of companies from Industry experts.

Open chat
Scan the code
Can we help you?