Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 822 · 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.🔍 Which line is missing its closing tag?
   line 1: <h1>Good morning!</h1>
   line 2: <b>Fun facts
   line 3: <p>Cricket is fun.</p> (a) line 1 (b) line 2 (c) line 3
2. 2.🏷️ HTML marks up text using ___. (a) tags (b) wires (c) pixels (d) keys
3. 3.📝 What does <p> make? (a) a table (b) a link (c) a paragraph (d) a picture
4. 4.🎨 Which attribute adds CSS inside one tag? (a) href (b) alt (c) src (d) style
5. 5.🔗 Which address opens when you click this link?
   <a href="news.html">Play games</a> (a) news.html (b) Play games (c) quiz.html (d) games.html
6. 6.What is <input type="submit"> for? (a) lets you pick only one (b) is for one line of words (c) sends the form (d) picks a day
7. 7.True or false: <li> shows 1, 2, 3 numbers. (a) False (b) True
8. 8.True or false: JavaScript puts a picture on a page. (a) True (b) False
9. 9.True or false: <input type="submit"> takes only numbers. (a) False (b) True
10. 10.💬 Which text will NOT show on the page?
    <p>I love mangoes.</p>
    <p>Hello, world!</p>
    <!-- <p>My pets</p> --> (a) My pets (b) I love mangoes. (c) Hello, world!
11. 11.✍️ What is the selector in this CSS rule?
    h1 {
      border: 2px solid;
      background-color: yellow;
    } (a) border (b) h1 (c) yellow (d) p
12. 12.📦 In the box model, which part is the text or picture? (a) padding (b) border (c) content (d) margin
13. 13.True or false: <input> has a closing tag. (a) True (b) False
14. 14.🔒 Is the connection to this address scrambled (encrypted)?
    http://www.example.com/maths/tables.html (a) No (b) Yes
15. 15.True or false: #top is an element selector. (a) True (b) False
16. 16.📋 Which list suits a shopping list in any order? (a) <br> (b) <ul> (c) <ol> (d) <hr>
17. 17.🔠 How many headings are in this code?
    <h1>I love mangoes.</h1>
    <p>Cricket is fun.</p>
    <p>I love mangoes.</p>
18. 18.📊 How many heading cells (<th>) does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th></tr>
      <tr><td>Mango</td><td>Litchi</td><td>Orange</td></tr>
      <tr><td>Banana</td><td>Jamun</td><td>Mango</td></tr>
    </table>
19. 19.🧭 Is <main> semantic or not semantic? (a) semantic (b) not semantic
20. 20.📝 On how many lines does the browser show this paragraph?
    <p>Roses are red<br>Kites fly high<br>Birds sing<br>Rivers flow<br>Stars shine</p>
21. 21.🔒 What does the lock (HTTPS) in the address bar mean? (a) the site is fast (b) the data is scrambled (c) the site is a game (d) the site is free
22. 22.🔁 Which word runs code only when something is true? (a) for (b) let (c) log (d) if
23. 23.🔁 What does this code print?
    let age = 13;
    if (age >= 40) {
      console.log("teen");
    } else {
      console.log("child");
    } (a) child (b) teen
24. 24.📱 The screen is 700px wide. Does the rule inside @media apply?
    p {
      font-size: 24px;
    }
    @media (min-width: 600px) {
      p {
        font-size: 26px;
      }
    } (a) No (b) Yes
25. 25.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 3; i++) {
      total = total + 4;
    }
    console.log(total);
26. 26.What does font-size do? (a) sets the letter colour (b) centres a heading (c) makes letters bigger (d) picks the font style
27. 27.True or false: #main is an element selector. (a) False (b) True
28. 28.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 180px;
      justify-content: center;
    }
    Inside are 2 boxes, each 80px wide (no margins).
29. 29.True or false: HTML on its own can count button clicks. (a) True (b) False
30. 30.🌈 Which colour is rgb(0, 255, 255)? (a) bright green (b) blue (c) cyan (d) white
31. 31.🖌️ What colour are the letters?
    p {
      font-size: 12px;
      color: yellow;
      background-color: purple;
      text-align: center;
    } (a) red (b) purple (c) yellow
32. 32.📊 In a table, which tag is a row? (a) <td> (b) <tb> (c) <tr> (d) <th>
33. 33.🔍 Which is the odd one out? (a) stores a website’s files (b) sends pages over the net (c) hosts websites online (d) is where we type code
34. 34.Which of these does CSS do? (a) makes a form box (b) changes the text size (c) changes the page live (d) puts a picture on a page
35. 35.🎨 Which tag connects an outside CSS file? (a) <css> (b) <link> (c) <a> (d) <img>
36. 36.📱 The screen is 375px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (min-width: 768px) {
      p {
        font-size: 18px;
      }
    }
37. 37.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 90px;
      justify-content: flex-end;
    }
    Inside are 2 boxes, each 40px wide (no margins).
38. 38.🌍 What is the path in this URL?
    http://learn.example.com/art/gallery.html (a) http (b) /art/gallery.html (c) /news/today.html (d) learn.example.com
39. 39.💬 How many paragraphs show on the page?
    <p>My pets</p>
    <p>My best friend</p>
    <p>Fun facts</p>
    <!-- <p>Cricket is fun.</p> -->
    <!-- <p>Our school trip</p> -->
40. 40.🔁 What does i++ do? (a) prints i (b) takes 1 from i (c) doubles i (d) adds 1 to i

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