Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 856 · 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.🧩 An opening tag + content + a closing tag together make an ___. (a) attribute (b) element (c) address (d) editor
2. 2.What does background-color do? (a) centres a heading (b) colours behind the text (c) sets the letter colour (d) makes letters bigger
3. 3.🔁 What does this code print?
   let score = 34;
   if (score >= 40) {
     console.log("You win");
   } else {
     console.log("Play again");
   } (a) You win (b) Play again
4. 4.⚖️ Which selector is the strongest? (a) a class selector (b) an id selector (c) an element selector
5. 5.True or false: <input type="password"> picks a day. (a) True (b) False
6. 6.🌗 Is dark grey on white easy or hard to read? (a) easy to read (b) hard to read
7. 7.🔠 Which heading shows the BIGGEST text: <h3>, <h4>, <h5> or <h1>? (a) <h5> (b) <h4> (c) <h3> (d) <h1>
8. 8.📝 How many paragraphs does this code make?
   <p>The red kite</p>
   <h2>The red kite</h2>
   <p>I love mangoes.</p>
   <h2>My best friend</h2>
9. 9.💪 How much empty space (px) is left after the last box?
   .row {
     display: flex;
     width: 210px;
     justify-content: flex-start;
   }
   Inside are 2 boxes, each 80px wide (no margins).
10. 10.🌈 Which colour is #0000ff? (a) white (b) magenta (c) red (d) blue
11. 11.📦 In the box model, which part is the text or picture? (a) padding (b) border (c) content (d) margin
12. 12.🎯 Which sign starts an id selector? (a) @ (b) # (c) . (d) &
13. 13.📄 Can HTML on its own show paragraphs? (a) Yes (b) No
14. 14.Which of these is padding? (a) the gap to other boxes (b) space outside the border (c) the gap round content (d) the text or picture
15. 15.🧩 Which language sets colours and fonts? (a) HTML (b) JavaScript (c) CSS
16. 16.📄 Where does <p> go: in the head or in the body? (a) in the head (b) in the body
17. 17.📊 Where do <td> cells go? (a) inside a <li> (b) inside the <head> (c) inside a <p> (d) inside a <tr>
18. 18.True or false: a code editor opens web pages for us. (a) False (b) True
19. 19.⚡ What number does this code print?
    let apples = 5;
    apples = apples + 20;
    apples = apples - 2;
    console.log(apples);
20. 20.📄 Where does <meta charset="utf-8"> go: in the head or in the body? (a) in the head (b) in the body
21. 21.🎨 Which attribute adds CSS inside one tag? (a) alt (b) href (c) src (d) style
22. 22.🔢 On a typical page, from top to bottom, what comes right after “<nav>”? (a) <footer> (b) <header> (c) <main>
23. 23.🔢 In a basic web page file, which comes first: “<html>” or “</html>”? (a) <html> (b) </html>
24. 24.True or false: <img> goes in the head. (a) True (b) False
25. 25.📝 How many <input> tags are in this form?
    <form>
      <input type="text">
      <input type="email">
      <input type="password">
      <input type="number">
      <input type="submit" value="Send">
    </form>
26. 26.✍️ CSS declarations go inside which brackets? (a) [ ] (b) < > (c) ( ) (d) { }
27. 27.Which of these is the border? (a) space inside the border (b) space outside the border (c) the gap round content (d) the line round the box
28. 28.💬 Which text will NOT show on the page?
    <!-- <p>Good morning!</p> -->
    <p>The red kite</p>
    <p>My best friend</p> (a) My best friend (b) Good morning! (c) The red kite
29. 29.True or false: .card is a class selector. (a) False (b) True
30. 30.📝 On how many lines does the browser show this paragraph?
    <p>Kites fly high<br>Stars shine<br>Rivers flow<br>Birds sing</p>
31. 31.🖼️ Which tag puts a picture on a page? (a) <pic> (b) <img> (c) <a> (d) <p>
32. 32.📊 How many cells are in each row?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th><th>Day</th></tr>
      <tr><td>Mango</td><td>Guava</td><td>Papaya</td><td>Grapes</td></tr>
    </table>
33. 33.⚖️ Two rules with the same selector set a colour. Which one wins? (a) the shorter one (b) neither (c) the first one (d) the later one
34. 34.📝 Which tag makes a big box for many lines of text? (a) <input> (b) <textarea> (c) <br> (d) <p>
35. 35.Which of these is true of a code editor? (a) shows pages from the web (b) opens web pages for us (c) saves our .html files (d) turns HTML into a page
36. 36.🎯 Which CSS selector matches this element?
    <div class="big" id="main">Hello</div> (a) span (b) .main (c) div (d) .red
37. 37.🔠 Which heading shows the BIGGEST text: <h6>, <h5>, <h2> or <h1>? (a) <h5> (b) <h2> (c) <h1> (d) <h6>
38. 38.🚀 Which file should this code go in: <a href="a.html">Go</a> (a) style.css (b) script.js (c) index.html
39. 39.True or false: a web browser shows pages from the web. (a) False (b) True
40. 40.🎨 One CSS file can style how many pages? (a) no pages (b) only one word (c) many pages (d) only one image

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