Free · 30 lessons · ages 10–16

HTML and CSS for kids — free HTML tutorial and web development course (ages 10–16)

Learn HTML, CSS and a little JavaScript by reading real code — tags, headings, lists, links, images, CSS selectors, colours, the box model, flexbox, media queries, forms, tables, accessibility and how websites work, in 30 short lessons with fresh questions every time. Great as HTML coding for Class 6 to Class 10: each lesson has a simple code tip, a worked example, “Show me how” help, a 20-question test, a badge, printable worksheets with answers and free certificates.

🌐 Quick check: What is HTML?

How this course works

  1. 1. Learn the ideaRead the short lesson and the rule.
  2. 2. Watch it workAn animated example, step by step.
  3. 3. PractiseFresh questions — “Show me how” if stuck.
  4. 4. Take the test20 questions — 16 right to pass.
  5. 5. Earn a badgeOne badge for every lesson.
  6. 6. Get a certificateFinish a part, get its certificate.

The 30 lessons

Each lesson has the idea, a worked example, unlimited practice with “Show me how”, a 20-question test and worksheets. Pass a lesson’s test to earn its badge; pass every lesson in a part to earn that part’s certificate (sign in to keep badges, certificates and progress).

Part 1 · HTML Basics

Ages 10–16 — what HTML is, tags and elements, headings, paragraphs and line breaks, lists, links, images and alt text, page structure, comments and a Part 1 test.

  1. Lesson 1 What is HTML? 🌐 Which one opens web pages for us? → a web browser
  2. Lesson 2 Tags and elements 🔍 One closing tag is missing. Which one? <em>Fun facts <h3>Rain toda…
  3. Lesson 3 Headings h1 to h6 🔠 Which heading shows the BIGGEST text: <h4>, <h2>, <h3> or <h6>? → …
  4. Lesson 4 Paragraphs and line breaks 📝 On how many lines does the browser show this paragraph? <p>Kites f…
  5. Lesson 5 Lists: ul, ol and li 📋 What number does the browser show next to “Jamun”? <ol start="3"> …
  6. Lesson 6 Links with a href 🔗 Which address opens when you click this link? <a href="games.html"…
  7. Lesson 7 Images with img, src and alt 🖼️ The picture cannot load. Which text does the browser show instead?…
  8. Lesson 8 Page structure: head and body 📄 What does the browser tab show for this page? <!DOCTYPE html> <htm…
  9. Lesson 9 HTML comments 💬 How many paragraphs show on the page? <!-- <p>Cricket is fun.</p> …
  10. Lesson 10 HTML basics test 📝 How many paragraphs does this code make? <p>Hello, world!</p> <p>I…

Part 2 · CSS

Ages 10–16 — what CSS does, CSS rules, selectors (element, class, id), colour and text properties, hex and rgb colours, the box model, which rule wins, flexbox, responsive design with media queries and a Part 2 test.

  1. Lesson 11 What CSS does 🧩 Which language puts a picture on a page? → HTML
  2. Lesson 12 CSS rules: selector, property, value ✍️ How many declarations (property: value pairs) are in this rule? bo…
  3. Lesson 13 Selectors: element, class and id 🎯 Which CSS selector matches this element? <li class="big" id="main"…
  4. Lesson 14 Colour and text properties 🖌️ What colour are the letters? p {   font-size: 32px;   background-c…
  5. Lesson 15 Colours: hex and rgb 🌈 In #ff0000 the red part is the hex number ff. What is it as a norm…
  6. Lesson 16 The box model 📦 How much space across (px) does this box take in all, margin inclu…
  7. Lesson 17 Which CSS rule wins? ⚖️ What colour is the text of this element? <p class="menu" id="hero"…
  8. Lesson 18 Flexbox basics 💪 How much empty space (px) is left after the last box? .row {   dis…
  9. Lesson 19 Responsive design and media queries 📱 The screen is 820px wide. What font-size (px) does the paragraph g…
  10. Lesson 20 CSS test 🖌️ What colour is behind the letters? p {   text-align: left;   font-…

Part 3 · Web Development

Ages 11–16 — forms and inputs, tables, semantic tags, accessibility, JavaScript basics, if and for loops, how websites work (URLs and HTTPS), web safety, your first website and a final test.

  1. Lesson 21 Forms and inputs 📝 At most, how many of these can be chosen at the same time? <form> …
  2. Lesson 22 Tables 📊 How many cells does this table have in all? <table>   <tr><th>Name…
  3. Lesson 23 Semantic tags 🧭 Which semantic tag holds the logo and title? → <header>
  4. Lesson 24 Accessibility basics ♿ A part of the page is under a <h4> heading. Which tag should its s…
  5. Lesson 25 JavaScript basics ⚡ What does this code print? (Look at the quotes!) let x = "5"; let …
  6. Lesson 26 JavaScript if and for loops 🔁 How many times does this code print “Well done”? for (let i = 0; i…
  7. Lesson 27 How websites work 🌍 What is the domain name in this URL? https://www.example.com/about…
  8. Lesson 28 Web safety 🔐 Is abcd1234 a strong or a weak password? → weak
  9. Lesson 29 Your first website 🚀 Which file should this code go in: <p>Hello!</p> → index.html
  10. Lesson 30 Web development final test ⚡ What number does this code print? let books = 28; books = books + …

What is web development for kids?

Web development is making web pages and websites. HTML builds the page — headings, paragraphs, lists, links, pictures, tables and forms are all made with tags. CSS styles it — colours, fonts, spacing, boxes and layouts that fit a phone or a big screen. JavaScript makes it do things — respond to a click, show a message, count and decide. This free course teaches HTML and CSS for beginners aged 10 to 16 by reading small pieces of real code and working out what the browser will show: which closing tag is missing, how many list items appear, which CSS selector matches, which rule wins, how wide a box is with padding, border and margin, where flexbox puts the space, which media query applies, and what a tiny JavaScript program prints. Part 1 is HTML basics, Part 2 is CSS, and Part 3 is web development: forms, tables, semantic tags, accessibility, a little JavaScript, URLs and HTTPS, web safety and a first website project. You need nothing to install — any web browser and a plain text editor are enough. When you are ready for full programming, the TalentJR coding academy at coding.talentjr.in teaches Python, JavaScript, C, C++ and SQL for Class 5 to 12.

Free html and css worksheets (PDF)

40 questions per sheet with an answer key — print, save as PDF or solve online.

HTML and CSS classes near you — online or at home

Prefer a real teacher? TalentJR teachers take live online classes anywhere in India and visit homes in selected cities. Tell us what you need and our team will call you with timings and fees.

Live online classesSmall groups or 1:1 with a teacher, from home, any city.
Teacher at homeA TalentJR teacher visits your home (selected cities).
At a centreClasses at a TalentJR partner centre near you, where available.
How would you like classes?
My learning Progress in every course, time spent, badges, certificates and where to continue. Computer worksheets Flowcharts, block coding, spreadsheets and safe internet. Typing game Type the falling words before they land.

HTML, CSS & Web Development questions

What is HTML and CSS for kids?

HTML is the language that builds web pages (headings, paragraphs, lists, links, pictures, tables and forms) and CSS is the language that styles them (colours, fonts, spacing and layout). This free course teaches both, plus a little JavaScript, in 30 short lessons for children aged 10 to 16.

What age is this web development course for?

Ages 10 to 16, roughly Class 5 to Class 10. Part 1 (HTML) suits beginners from about Class 5 or 6; Parts 2 and 3 (CSS and web development) suit Class 6 and above. Older students and parents who are new to coding can use it too.

Is this good for HTML coding for Class 6?

Yes. Part 1 covers the HTML usually taught in Class 6 and 7 computer books — tags, headings, paragraphs, lists, links, images and page structure — with fresh practice questions, worksheets and tests every time.

Do I need to install anything?

No. Any web browser and a plain text editor are enough to write and open your own web pages. The lessons, practice and tests work in the browser on a phone, tablet or computer.

HTML aur CSS kaise sikhe? (Hindi)

रोज़ 15–20 मिनट एक छोटा पाठ करें। पहले “Code tip” और उदाहरण पढ़ें, फिर 10 सवाल हल करें। गलत जवाब पर “Show me how” दबाकर समझें। किसी भी text editor में छोटा HTML पेज लिखें, .html नाम से सेव करें और browser में खोलकर देखें। हर भाग के अंत में टेस्ट दें और वर्कशीट प्रिंट करके दोहराएँ।

Are there printable HTML and CSS worksheets with answers?

Yes. Every lesson has free printable worksheets with an answer key — print them, save them as PDF or solve them online. Each time you open a worksheet you get a fresh set of questions with new code.

How do I get a certificate?

Sign in and pass the 20-question test of a lesson (16 or more right) to earn its badge. Pass every lesson of a part — Part 1 is lessons 1–10, Part 2 is 11–20, Part 3 is 21–30 — and you get that part’s certificate, with a code anyone can check.

Is this course free?

Yes. All 30 lessons, practice, tests, worksheets, badges and certificates are free. Classes with a TalentJR teacher (online or at home) are paid — request a call back for fees.

What should my child learn after HTML and CSS?

Real programming. The TalentJR coding academy at coding.talentjr.in teaches Python, JavaScript, C, C++ and SQL for Class 5 to 12, step by step with practice.

Are there coding or web design classes for kids near me?

TalentJR teachers take live online classes anywhere in India and visit homes in selected cities. Use the call-back form (“Classes near you”) on this page and our team will call you.