Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 696 · 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.🔁 What does this code print?
   let marks = 44;
   if (marks > 8) {
     console.log("Pass");
   } else {
     console.log("Try again");
   } (a) Pass (b) Try again
2. 2.🔁 Which word runs code only when something is true? (a) let (b) if (c) for (d) log
3. 3.Which of these is true of <nav>? (a) is the page’s key part (b) holds a news story (c) holds the menu of links (d) holds a side box of tips
4. 4.True or false: HTML on its own cannot count button clicks. (a) False (b) True
5. 5.True or false: JavaScript gives the page structure. (a) False (b) True
6. 6.💪 How wide (px) is each gap between two boxes?
   .row {
     display: flex;
     width: 260px;
     justify-content: space-between;
   }
   Inside are 4 boxes, each 50px wide (no margins).
7. 7.Which of these is not safe to do online? (a) keep passwords secret (b) tell a trusted adult (c) check for https first (d) put secrets in comments
8. 8.💬 How does an HTML comment start? (a) <!-- (b) /* (c) # (d) //
9. 9.🎯 What kind of selector is #main? (a) an element selector (b) a class selector (c) an id selector
10. 10.🌐 Which one shows line numbers? (a) a web browser (b) a web server (c) a code editor
11. 11.🔍 One closing tag is missing. Which one?
    <h3>Rain today
    <h2>My best friend</h2>
    <b>Our school trip</b> (a) </p> (b) </h2> (c) </h3> (d) </b>
12. 12.🔍 Which is the odd one out? (a) saves our .html files (b) shows pages from the web (c) turns HTML into a page (d) has an address bar
13. 13.🔠 Which tag is the least important heading? (a) <h3> (b) <p> (c) <h6> (d) <h1>
14. 14.True or false: in <img>, alt describes the picture. (a) False (b) True
15. 15.📝 On how many lines does the browser show this paragraph?
    <p>Stars shine<br>Rivers flow</p>
16. 16.🧭 Which semantic tag holds the main content? (a) <main> (b) <article> (c) <aside> (d) <header>
17. 17.📊 How many cells are in each row?
    <table>
      <tr><td>Guava</td><td>Guava</td></tr>
      <tr><td>Mango</td><td>Jamun</td></tr>
    </table>
18. 18.True or false: CSS puts a picture on a page. (a) True (b) False
19. 19.⚡ What number does this code print?
    let a = 33;
    let b = 7;
    console.log(a + b);
20. 20.True or false: <p> goes in the head. (a) False (b) True
21. 21.🌈 In #5a0000 the red part is the hex number 5a. What is it as a normal number?
22. 22.What does background-color do? (a) makes letters bigger (b) colours behind the text (c) makes the text bold (d) sets the letter colour
23. 23.📦 How much space top to bottom (px) does this box take in all, margin included?
    .box {
      height: 130px;
      padding: 20px;
      border: 2px solid black;
      margin: 5px;
    }
24. 24.🛡️ Is it safe to use the same password on every site? (a) No (b) Yes
25. 25.⚡ Which JavaScript word runs code when true? (a) if (b) alert() (c) for (d) console.log()
26. 26.🔠 How many headings are in this code?
    <h1>My pets</h1>
    <h2>Fun facts</h2>
    <h3>My best friend</h3>
    <h4>My pets</h4>
    <p>My best friend</p>
27. 27.✍️ What is the selector in this CSS rule?
    .box {
      font-size: 20px;
      background-color: yellow;
    } (a) yellow (b) font-size (c) h2 (d) .box
28. 28.⚖️ Two rules with the same selector set a colour. Which one wins? (a) neither (b) the shorter one (c) the later one (d) the first one
29. 29.📝 Which tag gives a form box a name you can click? (a) <label> (b) <h1> (c) <title> (d) <hr>
30. 30.🖌️ Which CSS property picks the font style? (a) color (b) background-color (c) font-size (d) font-family
31. 31.🔁 When does the else part run? (a) when if is false (b) never (c) when if is true (d) always
32. 32.📱 What does a media query check? (a) the battery level (b) the time of day (c) the page title (d) the screen width
33. 33.✍️ What is the selector in this CSS rule?
    li {
      color: red;
      margin: 10px;
      width: 300px;
    } (a) body (b) color (c) li (d) 10px
34. 34.⚖️ What colour is the text of this element?
    <h2 class="big" id="end">Hi</h2>
    CSS:
    #end { color: purple; }
    #end { color: red; } (a) blue (b) green (c) red (d) purple
35. 35.🌈 In #000000 the blue part is the hex number 00. What is it as a normal number?
36. 36.🔗 Which words do you click on?
    <a href="contact.html">Art corner</a> (a) contact.html (b) href (c) Art corner (d) School news
37. 37.🧩 An opening tag + content + a closing tag together make an ___. (a) address (b) element (c) editor (d) attribute
38. 38.Which colour pair is hard to read? (a) yellow on black (b) dark grey on white (c) yellow on white (d) white on dark blue
39. 39.What is <input type="password"> for? (a) sends the form (b) takes only numbers (c) hides what you type (d) picks a day
40. 40.📄 Where does <style> go: in the head or in the body? (a) in the body (b) in the head

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