Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 64 · 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 many paragraphs does this code make?
   <p>Fun facts</p>
   <p>The red kite</p>
   <h2>Hello, world!</h2>
   <p>Fun facts</p>
   <p>The red kite</p>
   <h2>Hello, world!</h2>
2. 2.⚖️ What colour is the text of this element?
   <h1 class="box" id="hero">Hi</h1>
   CSS:
   .box { color: red; }
   h1 { color: green; }
   #hero { color: purple; } (a) red (b) green (c) purple (d) black
3. 3.🔍 Which line is missing its closing tag?
   line 1: <h1>My pets</h1>
   line 2: <em>Good morning!</em>
   line 3: <h3>My best friend (a) line 2 (b) line 3 (c) line 1
4. 4.🌈 Which colour is #ffff00? (a) black (b) bright green (c) yellow (d) magenta
5. 5.✍️ Which sign goes between a property and its value? (a) = (b) - (c) : (d) ;
6. 6.📱 The screen is 820px wide. What font-size (px) does the paragraph get?
   p {
     font-size: 20px;
   }
   @media (max-width: 480px) {
     p {
       font-size: 18px;
     }
   }
7. 7.📝 You type 5 spaces between two words in a <p>. How does the browser show them? (a) as 5 spaces (b) as a new line (c) as a dot (d) as one space
8. 8.🎨 Which tag holds CSS inside the head? (a) <script> (b) <body> (c) <css> (d) <style>
9. 9.🖼️ Why do we add alt text to an image? (a) to describe the image (b) to load it faster (c) to colour it (d) to make it bigger
10. 10.🛡️ Should you share your password with your best friend? (a) No (b) Yes
11. 11.💬 Which text will NOT show on the page?
    <p>Fun facts</p>
    <!-- <p>The red kite</p> -->
    <p>Our school trip</p>
    <p>My pets</p> (a) Our school trip (b) My pets (c) Fun facts (d) The red kite
12. 12.🔗 What does target="_blank" do to a link? (a) makes it blank (b) makes it bold (c) opens it in a new tab (d) hides the link
13. 13.What does justify-content: center do? (a) packs boxes at the start (b) puts boxes in the middle (c) equal gaps, none at ends (d) packs boxes at the end
14. 14.📱 The screen is 820px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 10px;
      }
    }
15. 15.Which of these is the border? (a) the text or picture (b) a solid or dotted edge (c) the gap to other boxes (d) space inside the border
16. 16.🔍 Which line is missing its closing tag?
    line 1: <em>The red kite</em>
    line 2: <i>My best friend</i>
    line 3: <b>I love mangoes. (a) line 2 (b) line 3 (c) line 1
17. 17.🖼️ Which attribute of <img> tells which image to load? (a) src (b) width (c) height (d) alt
18. 18.💬 How many paragraphs show on the page?
    <!-- <p>The red kite</p> -->
    <!-- <p>Cricket is fun.</p> -->
    <!-- <p>My best friend</p> -->
    <!-- <p>I love mangoes.</p> -->
    <p>Rain today</p>
19. 19.⚖️ What colour is the text of this element?
    <h1 class="red" id="main">Hi</h1>
    CSS:
    .red { color: orange; }
    .red { color: black; } (a) black (b) orange (c) purple (d) white
20. 20.📊 Are <th> cells shown bold and centred by default? (a) Yes (b) No
21. 21.🔗 Which attribute holds the address of a link? (a) alt (b) src (c) id (d) href
22. 22.🚀 Which file should this code go in: alert("Hi"); (a) script.js (b) index.html (c) style.css
23. 23.True or false: score = score + 1; goes in script.js. (a) False (b) True
24. 24.🖼️ How many pixels wide is the picture drawn?
    <img src="moon.png" alt="The full moon" width="400">
25. 25.🔗 Which words do you click on?
    <a href="games.html">Play games</a> (a) games.html (b) href (c) About us (d) Play games
26. 26.🛡️ Online: is it safe to type a password on http? (a) safe (b) not safe
27. 27.🖼️ Which tag puts a picture on a page? (a) <a> (b) <pic> (c) <p> (d) <img>
28. 28.🌗 Is light grey on white easy or hard to read? (a) easy to read (b) hard to read
29. 29.🔒 Is the connection to this address scrambled (encrypted)?
    https://www.example.com/games/chess.html (a) Yes (b) No
30. 30.🔗 Which address opens when you click this link?
    <a href="about.html">Take the quiz</a> (a) about.html (b) https://example.com (c) contact.html (d) Take the quiz
31. 31.🌍 What finds the server for a domain name like example.com? (a) CSS (b) HTML (c) DNS (d) alt
32. 32.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 300px;
      justify-content: center;
    }
    Inside are 4 boxes, each 60px wide (no margins).
33. 33.Which of these is true of a web server? (a) shows pages from the web (b) is where we type code (c) saves our .html files (d) stores a website’s files
34. 34.✍️ Which property is set to 300px in this rule?
    h2 {
      font-weight: bold;
      background-color: yellow;
      width: 300px;
      padding: 8px;
    } (a) width (b) color (c) 300px (d) font-style
35. 35.📋 Which list shows the steps of a recipe best? (a) <br> (b) <ul> (c) <hr> (d) <ol>
36. 36.🧭 Which semantic tag holds one blog post? (a) <aside> (b) <nav> (c) <footer> (d) <article>
37. 37.🖼️ How many pixels wide is the picture drawn?
    <img src="map.png" alt="Map of India" width="300">
38. 38.True or false: a web browser colours code to help us. (a) False (b) True
39. 39.⚖️ Which selector is the strongest? (a) a class selector (b) an id selector (c) an element selector
40. 40.🔁 How many times does this code print “Welcome”?
    for (let i = 1; i <= 5; i++) {
      console.log("Welcome");
    }

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