Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 996 · 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 of these does JavaScript do? (a) makes a form box (b) puts a picture on a page (c) checks a quiz answer (d) sets colours and fonts
2. 2.🔍 Which line is missing its closing tag?
   line 1: <p>My best friend</p>
   line 2: <strong>Our school trip
   line 3: <small>Fun facts</small> (a) line 1 (b) line 3 (c) line 2
3. 3.🔍 One closing tag is missing. Which one?
   <h1>My pets</h1>
   <i>I love mangoes.</i>
   <h2>Our school trip (a) </h3> (b) </h2> (c) </i> (d) </h1>
4. 4.⚡ Which JavaScript word repeats code? (a) for (b) console.log() (c) let (d) alert()
5. 5.📝 How many <input> tags are in this form?
   <form>
     <input type="checkbox">
     <input type="password">
     <input type="submit" value="Send">
   </form>
6. 6.True or false: HTTPS scrambles data on its way. (a) False (b) True
7. 7.🖼️ How many pixels wide is the picture drawn?
   <img src="bus.jpg" alt="Our school bus" width="250">
8. 8.⚡ Which JavaScript word shows a pop-up box? (a) let (b) for (c) alert() (d) console.log()
9. 9.True or false: HTML on its own can make a form. (a) False (b) True
10. 10.🌍 Which one stores the site’s files? (a) HTTPS (b) the server (c) the URL (d) the browser
11. 11.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 200px;
      justify-content: center;
    }
    Inside are 2 boxes, each 40px wide (no margins).
12. 12.🖌️ What colour is behind the letters?
    h2 {
      text-align: left;
      background-color: blue;
      font-size: 36px;
      color: purple;
    } (a) purple (b) green (c) blue
13. 13.🚀 Which file is best for the colours and fonts? (a) style.css (b) photo.jpg (c) index.html (d) script.js
14. 14.⚖️ What colour is the text of this element?
    <p class="big" id="intro">Hi</p>
    CSS:
    p { color: orange; }
    p { color: red; } (a) orange (b) black (c) purple (d) red
15. 15.🌗 Is dark grey on white easy or hard to read? (a) easy to read (b) hard to read
16. 16.🔍 One closing tag is missing. Which one?
    <u>My best friend</u>
    <small>Our school trip</small>
    <h1>The red kite (a) </small> (b) </i> (c) </h1> (d) </u>
17. 17.What does color do? (a) makes the text bold (b) sets the letter colour (c) centres a heading (d) makes letters bigger
18. 18.🔗 Which words do you click on?
    <a href="contact.html">Maths fun</a> (a) Maths fun (b) contact.html (c) Art corner (d) href
19. 19.🔁 How many times does this code print “Welcome”?
    for (let i = 0; i < 6; i++) {
      console.log("Welcome");
    }
20. 20.🧩 Which language makes a form box? (a) JavaScript (b) HTML (c) CSS
21. 21.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
    .box {
      width: 170px;
      padding: 20px;
      border: 2px solid black;
      margin: 20px;
    }
22. 22.📊 Which tag makes a heading cell? (a) <tr> (b) <td> (c) <caption> (d) <th>
23. 23.🔗 Which words do you click on?
    <a href="https://example.com">School news</a> (a) href (b) Take the quiz (c) https://example.com (d) School news
24. 24.🌈 In #280000 the red part is the hex number 28. What is it as a normal number?
25. 25.📋 Does this list show bullets or numbers?
    <ul>
      <li>Jamun</li>
      <li>Mango</li>
      <li>Guava</li>
    </ul> (a) bullets (b) numbers
26. 26.💬 Which text will NOT show on the page?
    <p>My best friend</p>
    <!-- <p>Fun facts</p> -->
    <p>I love mangoes.</p>
    <p>Rain today</p> (a) My best friend (b) Rain today (c) Fun facts (d) I love mangoes.
27. 27.📝 What does <hr> draw? (a) a line across the page (b) a picture (c) a table (d) a link
28. 28.Which of these is not safe to do online? (a) type a password on http (b) check for https first (c) keep passwords secret (d) log out on shared PCs
29. 29.📦 In the box model, which part is the gap to other boxes? (a) border (b) content (c) padding (d) margin
30. 30.💪 How wide (px) is each gap between two boxes?
    .row {
      display: flex;
      width: 380px;
      justify-content: space-between;
    }
    Inside are 3 boxes, each 100px wide (no margins).
31. 31.🚀 Which file is best for code that reacts to clicks? (a) style.css (b) notes.txt (c) script.js (d) index.html
32. 32.🔠 Which heading shows the BIGGEST text: <h4>, <h6>, <h1> or <h5>? (a) <h1> (b) <h4> (c) <h6> (d) <h5>
33. 33.🚀 What is the home page file of a website usually called? (a) main.png (b) index.html (c) home.css (d) start.js
34. 34.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 3; i++) {
      total = total + i;
    }
    console.log(total);
35. 35.🔠 How many headings are in this code?
    <h1>Cricket is fun.</h1>
    <p>I love mangoes.</p>
    <h2>Fun facts</h2>
    <h4>Fun facts</h4>
    <p>Cricket is fun.</p>
36. 36.🔒 What does the lock (HTTPS) in the address bar mean? (a) the data is scrambled (b) the site is free (c) the site is a game (d) the site is fast
37. 37.💬 How many paragraphs show on the page?
    <p>The red kite</p>
    <!-- <p>Hello, world!</p> -->
    <p>My best friend</p>
    <p>I love mangoes.</p>
38. 38.📝 On how many lines does the browser show this paragraph?
    <p>Rivers flow<br>Birds sing<br>Stars shine<br>Sky is blue<br>Roses are red</p>
39. 39.🏷️ Which is the closing tag for <i>? (a) <i/> (b) <i> (c) <\i> (d) </i>
40. 40.True or false: margin is space outside the border. (a) True (b) False

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