Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 613 · 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 much space across (px) does this box take in all, margin included?
   .box {
     width: 240px;
     padding: 15px;
     border: 4px solid black;
     margin: 5px;
   }
2. 2.📝 Does <li> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
3. 3.📄 Where does the text of <title> appear? (a) nowhere (b) in a big heading (c) at the bottom (d) on the browser tab
4. 4.📦 How much space top to bottom (px) does this box take in all, margin included?
   .box {
     height: 160px;
     padding: 10px;
     border: 3px solid black;
     margin: 5px;
   }
5. 5.Which of these is a strong password? (a) 123456 (b) iloveyou (c) riya2014 (d) S0lar!Pen#8
6. 6.📦 In the box model, which part is the gap to other boxes? (a) margin (b) border (c) padding (d) content
7. 7.🔠 Which heading shows the BIGGEST text: <h6>, <h2>, <h4> or <h3>? (a) <h3> (b) <h2> (c) <h6> (d) <h4>
8. 8.What is <input type="date"> for? (a) takes only numbers (b) picks a day (c) is for one line of words (d) lets you tick many
9. 9.🚀 Which file should this code go in: <p>Hello!</p> (a) script.js (b) style.css (c) index.html
10. 10.🌈 In #0000a6 the blue part is the hex number a6. What is it as a normal number?
11. 11.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 7; i++) {
      total = total + 8;
    }
    console.log(total);
12. 12.🔠 Which tag is used for the main title on a page? (a) <br> (b) <p> (c) <h6> (d) <h1>
13. 13.🔢 On a typical page, from top to bottom, what comes right after “<main>”? (a) <nav> (b) <footer> (c) <header>
14. 14.🔢 When you open a web page, which comes first: “the browser shows it” or “DNS finds the server”? (a) DNS finds the server (b) the browser shows it
15. 15.Which of these is margin? (a) the text or picture (b) the gap round content (c) space outside the border (d) the line round the box
16. 16.🛡️ Should you share your password with your best friend? (a) Yes (b) No
17. 17.True or false: <h1> goes in the head. (a) True (b) False
18. 18.🖌️ What colour are the letters?
    h1 {
      color: green;
      font-size: 24px;
      background-color: orange;
      text-align: left;
    } (a) green (b) orange (c) white
19. 19.🖼️ Which tag puts a picture on a page? (a) <a> (b) <p> (c) <pic> (d) <img>
20. 20.⚖️ What colour is the text of this element?
    <p class="star" id="hero">Hi</p>
    CSS:
    #hero { color: purple; }
    #hero { color: red; } (a) blue (b) red (c) white (d) purple
21. 21.🔗 Which words do you click on?
    <a href="games.html">Visit the site</a> (a) href (b) Maths fun (c) Visit the site (d) games.html
22. 22.♿ Is this heading order correct (no level skipped)?
    <h1> → <h1> → <h2> → <h3> (a) No (b) Yes
23. 23.Which of these is an empty tag? (a) <b> (b) <p> (c) <h1> (d) <hr>
24. 24.Which of these does HTML do? (a) reacts to a button click (b) makes a link (c) lays out the page (d) adds space around boxes
25. 25.💬 How does an HTML comment start? (a) // (b) /* (c) # (d) <!--
26. 26.🔍 Which is the odd one out? (a) makes headings and lists (b) counts down a timer (c) gives the page structure (d) puts a picture on a page
27. 27.✍️ How many declarations (property: value pairs) are in this rule?
    #top {
      color: red;
    }
28. 28.🔠 Which heading shows the BIGGEST text: <h5>, <h4>, <h1> or <h6>? (a) <h5> (b) <h4> (c) <h1> (d) <h6>
29. 29.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 9; i++) {
      total = total + i;
    }
    console.log(total);
30. 30.Which of these does CSS do? (a) makes a link (b) sets colours and fonts (c) shows a pop-up message (d) makes a form box
31. 31.📝 You type 5 spaces between two words in a <p>. How does the browser show them? (a) as one space (b) as 5 spaces (c) as a dot (d) as a new line
32. 32.💪 Which flexbox property turns on flexbox? (a) flex-direction (b) align-items (c) justify-content (d) display: flex
33. 33.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 240px;
      padding: 20px;
      border: 2px solid black;
      margin: 15px;
    }
34. 34.What does background-color do? (a) colours behind the text (b) picks the font style (c) sets the letter colour (d) centres a heading
35. 35.🌍 What is the protocol in this URL?
    http://www.example.net/maths/tables.html (a) https (b) /maths/tables.html (c) www.example.net (d) http
36. 36.🔁 Which loop repeats code a set number of times? (a) for (b) else (c) let (d) if
37. 37.🔗 Which words do you click on?
    <a href="quiz.html">Take the quiz</a> (a) Take the quiz (b) href (c) quiz.html (d) Play games
38. 38.🌍 What finds the server for a domain name like example.com? (a) alt (b) CSS (c) DNS (d) HTML
39. 39.🔠 How many heading levels does HTML have? (a) 4 (b) 10 (c) 3 (d) 6
40. 40.🔗 Which words do you click on?
    <a href="contact.html">Art corner</a> (a) contact.html (b) href (c) School news (d) Art corner

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