Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 922 · 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.📱 The screen is 1366px wide. Does the rule inside @media apply?
   p {
     font-size: 20px;
   }
   @media (min-width: 480px) {
     p {
       font-size: 28px;
     }
   } (a) Yes (b) No
2. 2.✍️ Which sign goes between a property and its value? (a) : (b) = (c) - (d) ;
3. 3.💬 Why do coders write comments? (a) to show pictures (b) to leave notes (c) to make links (d) to add colour
4. 4.True or false: <input type="email"> is for one line of words. (a) False (b) True
5. 5.💬 Which text will NOT show on the page?
   <!-- <p>Our school trip</p> -->
   <p>The red kite</p>
   <p>I love mangoes.</p> (a) I love mangoes. (b) The red kite (c) Our school trip
6. 6.🔠 Which heading shows the SMALLEST text: <h4>, <h3>, <h1> or <h2>? (a) <h4> (b) <h2> (c) <h3> (d) <h1>
7. 7.💬 Which text will NOT show on the page?
   <p>Hello, world!</p>
   <p>Cricket is fun.</p>
   <!-- <p>The red kite</p> --> (a) The red kite (b) Hello, world! (c) Cricket is fun.
8. 8.🔠 Which heading shows the BIGGEST text: <h3>, <h1>, <h4> or <h5>? (a) <h5> (b) <h4> (c) <h3> (d) <h1>
9. 9.💪 How much empty space (px) is before the first box?
   .row {
     display: flex;
     width: 470px;
     justify-content: flex-end;
   }
   Inside are 4 boxes, each 100px wide (no margins).
10. 10.🔠 Which heading shows the BIGGEST text: <h4>, <h6>, <h5> or <h3>? (a) <h6> (b) <h4> (c) <h5> (d) <h3>
11. 11.🖌️ What colour are the letters?
    h2 {
      font-size: 32px;
      text-align: left;
      background-color: yellow;
      color: black;
    } (a) yellow (b) black (c) blue
12. 12.Which of these has a closing tag? (a) <br> (b) <input> (c) <meta> (d) <b>
13. 13.Which of these is a closing tag? (a) <p> (b) </h1> (c) <title> (d) <body>
14. 14.🎯 Which CSS selector matches this element?
    <p class="note" id="logo">Hello</p> (a) #note (b) .big (c) #end (d) #logo
15. 15.🌈 Which colour of light is strongest in rgb(172, 0, 27)? (a) blue (b) red (c) green
16. 16.🧩 Which language reacts to a button click? (a) JavaScript (b) CSS (c) HTML
17. 17.⚖️ What colour is the text of this element?
    <h1 class="big" id="end">Hi</h1>
    CSS:
    .big { color: orange; }
    h1 { color: purple; } (a) white (b) purple (c) green (d) orange
18. 18.What is <input type="text"> for? (a) is for one line of words (b) sends the form (c) takes only numbers (d) is for an email address
19. 19.🖌️ Which CSS property picks the font style? (a) background-color (b) font-size (c) font-weight (d) font-family
20. 20.♿ Is this heading order correct (no level skipped)?
    <h1> → <h2> → <h3> → <h5> (a) Yes (b) No
21. 21.🖌️ What colour is behind the letters?
    h2 {
      color: red;
      font-size: 24px;
      background-color: white;
      text-align: right;
    } (a) white (b) green (c) red
22. 22.🖌️ What colour are the letters?
    h1 {
      color: red;
      font-size: 24px;
      text-align: center;
      background-color: purple;
    } (a) blue (b) purple (c) red
23. 23.📱 The screen is 375px wide. Does the rule inside @media apply?
    p {
      font-size: 16px;
    }
    @media (max-width: 600px) {
      p {
        font-size: 12px;
      }
    } (a) No (b) Yes
24. 24.📋 Which tag goes around each item of a list? (a) <ul> (b) <li> (c) <ol> (d) <p>
25. 25.📄 What is the first line of an HTML5 page? (a) <html> (b) <head> (c) <!DOCTYPE html> (d) <body>
26. 26.⚡ Which JavaScript word runs code when true? (a) if (b) for (c) console.log() (d) let
27. 27.📊 Where do <td> cells go? (a) inside a <p> (b) inside the <head> (c) inside a <tr> (d) inside a <li>
28. 28.🧭 How many <main> parts should a page have? (a) ten (b) one (c) three (d) none
29. 29.🔠 Which heading shows the SMALLEST text: <h1>, <h4>, <h3> or <h6>? (a) <h1> (b) <h3> (c) <h6> (d) <h4>
30. 30.📦 In the box model, which part is the text or picture? (a) margin (b) content (c) border (d) padding
31. 31.🛡️ Online: is it safe to tell a trusted adult? (a) not safe (b) safe
32. 32.🔗 What does target="_blank" do to a link? (a) makes it blank (b) opens it in a new tab (c) hides the link (d) makes it bold
33. 33.🔢 To build and share your first web page, which comes FIRST? (a) write the HTML (b) add CSS styles (c) plan what to show (d) publish it online
34. 34.🔗 Which code links to about.html? (a) <link about.html> (b) <a alt="about.html"> (c) <a href="about.html"> (d) <a src="about.html">
35. 35.True or false: the content is the line round the box. (a) False (b) True
36. 36.📝 Does <p> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
37. 37.What is <input type="email"> for? (a) is for an email address (b) lets you tick many (c) is for one line of words (d) sends the form
38. 38.True or false: <h1> has a closing tag. (a) False (b) True
39. 39.True or false: in <img>, src describes the picture. (a) True (b) False
40. 40.📝 How many paragraphs does this code make?
    <p>Good morning!</p>
    <h2>My pets</h2>
    <p>The red kite</p>
    <p>Cricket is fun.</p>
    <h2>My best friend</h2>

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