Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 858 · 40 questions

Code tip (Read it like a browser): Find the topic: HTML, CSS, JavaScript or how the web works. Read the code line by line, the way a browser would. For sums and loops, write each step down and check it again.

1. 1.📊 How many rows does this table have?
   <table>
     <tr><th>Name</th><th>Fruit</th><th>Price</th></tr>
     <tr><td>Guava</td><td>Litchi</td><td>Papaya</td></tr>
   </table>
2. 2.True or false: <ul> has a closing tag. (a) False (b) True
3. 3.📄 What is the big heading shown on this page?
   <!DOCTYPE html>
   <html>
   <head>
     <title>Art Gallery</title>
   </head>
   <body>
     <h1>Match report</h1>
     <p>Here is my best one.</p>
   </body>
   </html> (a) Art Gallery (b) Here is my best one. (c) body (d) Match report
4. 4.✍️ In color: blue; which part is the value? (a) : (b) color (c) blue (d) ;
5. 5.Which of these is safe to do online? (a) share your password (b) put secrets in comments (c) post your home address (d) log out on shared PCs
6. 6.🏷️ Which is the closing tag for <h1>? (a) <\h1> (b) <h1> (c) </h1> (d) <h1/>
7. 7.True or false: <p>Hello!</p> goes in script.js. (a) False (b) True
8. 8.🔁 What does this code print?
   let temp = 39;
   if (temp > 16) {
     console.log("Hot");
   } else {
     console.log("Cool");
   } (a) Hot (b) Cool
9. 9.🔗 Which code links to about.html? (a) <link about.html> (b) <a alt="about.html"> (c) <a href="about.html"> (d) <a src="about.html">
10. 10.♿ Does this help everyone, or make the page harder to use: images with no alt? (a) makes it harder (b) helps everyone
11. 11.📄 Which part holds everything you see on the page? (a) the body (b) the doctype (c) the head (d) the title
12. 12.⚖️ Which selector is the strongest? (a) a class selector (b) an id selector (c) an element selector
13. 13.⚡ Which word makes a new variable? (a) let (b) make (c) give (d) put
14. 14.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="bus.jpg" alt="Our school bus" width="250"> (a) An old fort (b) width (c) bus.jpg (d) Our school bus
15. 15.True or false: “images with no alt” helps everyone use the page. (a) True (b) False
16. 16.Which of these is an opening tag? (a) <title> (b) </p> (c) </li> (d) </title>
17. 17.🔠 Which heading shows the BIGGEST text: <h3>, <h6>, <h5> or <h2>? (a) <h6> (b) <h3> (c) <h5> (d) <h2>
18. 18.📊 Which tag makes one data cell? (a) <tr> (b) <th> (c) <td> (d) <table>
19. 19.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 200px;
      padding: 25px;
      border: 5px solid black;
      margin: 15px;
    }
20. 20.🔢 To build and share your first web page, what comes right after “plan what to show”? (a) publish it online (b) add CSS styles (c) test in a browser (d) write the HTML
21. 21.📝 On how many lines does the browser show this paragraph?
    <p>Sky is blue<br>Stars shine<br>Kites fly high</p>
22. 22.Which of these is true of <article>? (a) holds extra side notes (b) is the page’s key part (c) holds one blog post (d) holds a side box of tips
23. 23.🔠 How many <h1> headings should a page usually have? (a) 10 (b) 6 (c) 1 (d) 3
24. 24.🔢 On a typical page, from top to bottom, which comes FIRST? (a) <main> (b) <footer> (c) <nav> (d) <header>
25. 25.♿ A part of the page is under a <h5> heading. Which tag should its sub-heading use? (a) <h2> (b) <h5> (c) <h6> (d) <h3>
26. 26.🔢 To build and share your first web page, which comes LAST? (a) publish it online (b) plan what to show (c) test in a browser (d) write the HTML
27. 27.📄 What is the first line of an HTML5 page? (a) <!DOCTYPE html> (b) <html> (c) <body> (d) <head>
28. 28.⚡ What does this code print? (Look at the quotes!)
    let x = "8";
    let y = 8;
    console.log(x + y); (a) 16 (b) 88 (c) Error
29. 29.🔠 How many headings are in this code?
    <h1>My best friend</h1>
    <h4>My best friend</h4>
    <p>Cricket is fun.</p>
    <h2>Good morning!</h2>
    <p>My best friend</p>
30. 30.💪 How wide (px) is each gap between two boxes?
    .row {
      display: flex;
      width: 180px;
      justify-content: space-between;
    }
    Inside are 3 boxes, each 40px wide (no margins).
31. 31.💬 Why do coders write comments? (a) to show pictures (b) to leave notes (c) to add colour (d) to make links
32. 32.What does font-family do? (a) makes the text bold (b) centres a heading (c) colours behind the text (d) picks the font style
33. 33.True or false: <input type="text"> lets you pick only one. (a) False (b) True
34. 34.🎯 Which element does the selector #hero style? (a) <li id="top"> (b) <li id="hero"> (c) <div class="red"> (d) <li class="hero">
35. 35.⚡ What does this code show?
    let name = "Meera";
    alert("Hello, " + name + "!"); (a) Meera (b) Hello, Meera! (c) name (d) Hello, name!
36. 36.♿ Is this heading order correct (no level skipped)?
    <h1> → <h2> → <h2> → <h4> (a) No (b) Yes
37. 37.📱 min-width: 800px applies when the screen is ___. (a) 800px or wider (b) exactly 100px (c) 800px or narrower (d) turned off
38. 38.📋 Which list tag is an unordered list? (a) <ol> (b) <li> (c) <ul>
39. 39.🔍 Which is the odd one out? (a) makes a form box (b) gives the page structure (c) sets colours and fonts (d) makes a link
40. 40.Which of these is true of <header>? (a) holds the main content (b) holds copyright notes (c) holds extra side notes (d) holds the logo and title

Free html and css lessons, practice and worksheets at talentjr.in/html-css-for-kids