Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 241 · 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 heading shows the SMALLEST text: <h1>, <h3>, <h4> or <h5>? (a) <h3> (b) <h4> (c) <h5> (d) <h1>
2. 2.True or false: <meta charset="utf-8"> goes in the body. (a) True (b) False
3. 3.🌈 Hex digits go 0 to 9, then A to which letter? (a) Z (b) G (c) F (d) J
4. 4.🔁 What is the LAST number this code prints?
   for (let i = 0; i < 12; i = i + 4) {
     console.log(i);
   }
5. 5.🧭 Why use <nav> instead of <div> for a menu? (a) it makes text red (b) it tells its meaning (c) it loads faster (d) it adds pictures
6. 6.📱 max-width: 600px applies when the screen is ___. (a) 600px or narrower (b) exactly 1000px (c) turned off (d) 600px or wider
7. 7.🔢 When you open a web page, what comes right after “you type the URL”? (a) the browser shows it (b) the server sends files (c) the browser asks it (d) DNS finds the server
8. 8.Which of these is true of <header>? (a) sits at the bottom (b) holds one blog post (c) holds the main content (d) sits at the very top
9. 9.✍️ Which sign goes between a property and its value? (a) - (b) ; (c) = (d) :
10. 10.📋 Which list tag lists steps in order? (a) <ul> (b) <ol> (c) <li>
11. 11.✍️ How many declarations (property: value pairs) are in this rule?
    body {
      font-size: 20px;
    }
12. 12.📦 In the box model, which part is space inside the border? (a) content (b) border (c) padding (d) margin
13. 13.Which of these does HTML do? (a) shows a pop-up message (b) puts a picture on a page (c) checks a quiz answer (d) sets colours and fonts
14. 14.🧩 Which language makes a link? (a) CSS (b) JavaScript (c) HTML
15. 15.⚖️ Which selector is the strongest? (a) a class selector (b) an element selector (c) an id selector
16. 16.True or false: <header> holds the menu of links. (a) False (b) True
17. 17.Which colour pair is hard to read? (a) white on dark blue (b) white on black (c) dark grey on white (d) yellow on white
18. 18.📱 The screen is 375px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 20px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 14px;
      }
    }
19. 19.📦 In the box model, which part is the gap to other boxes? (a) content (b) margin (c) padding (d) border
20. 20.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 6; i++) {
      total = total + 2;
    }
    console.log(total);
21. 21.True or false: <ul><li>Art</li></ul> goes in script.js. (a) False (b) True
22. 22.🖼️ Which tag puts a picture on a page? (a) <pic> (b) <a> (c) <p> (d) <img>
23. 23.True or false: to put secrets in comments is not safe. (a) False (b) True
24. 24.🏷️ Is </b> an opening tag or a closing tag? (a) a closing tag (b) an opening tag
25. 25.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 150px;
      justify-content: flex-start;
    }
    Inside are 2 boxes, each 60px wide (no margins).
26. 26.🔠 How many headings are in this code?
    <h1>Fun facts</h1>
    <p>Good morning!</p>
    <h2>The red kite</h2>
    <h4>Rain today</h4>
27. 27.✍️ How does a CSS comment start? (a) /* (b) <!-- (c) # (d) //
28. 28.🔗 Which attribute holds the address of a link? (a) src (b) id (c) alt (d) href
29. 29.🔢 In a basic web page file, which comes first: “<!DOCTYPE html>” or “<head>”? (a) <head> (b) <!DOCTYPE html>
30. 30.What does justify-content: space-between do? (a) puts boxes in the middle (b) packs boxes at the end (c) equal gaps, none at ends (d) packs boxes at the start
31. 31.Which of these is an opening tag? (a) </title> (b) </b> (c) </h1> (d) <h1>
32. 32.🔢 When you open a web page, which comes FIRST? (a) the browser shows it (b) the browser asks it (c) the server sends files (d) you type the URL
33. 33.True or false: in <img>, src tells which image to load. (a) True (b) False
34. 34.📦 In the box model, which part is the line round the box? (a) margin (b) content (c) border (d) padding
35. 35.⚖️ Two rules with the same selector set a colour. Which one wins? (a) the first one (b) the shorter one (c) neither (d) the later one
36. 36.🌐 Which one colours code to help us? (a) a web browser (b) a web server (c) a code editor
37. 37.📱 The screen is 540px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 16px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 10px;
      }
    }
38. 38.🔠 Which heading shows the SMALLEST text: <h6>, <h4>, <h3> or <h5>? (a) <h4> (b) <h3> (c) <h6> (d) <h5>
39. 39.🌍 What is the protocol in this URL?
    http://www.example.net/news/today.html (a) http (b) https (c) www.example.net (d) /news/today.html
40. 40.🔠 How many headings are in this code?
    <h1>Hello, world!</h1>
    <h2>Hello, world!</h2>
    <h2>Rain today</h2>

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