Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 538 · 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 is the protocol in this URL?
   http://learn.example.com/index.html (a) https (b) /index.html (c) learn.example.com (d) http
2. 2.📦 In the box model, which part is space inside the border? (a) border (b) content (c) margin (d) padding
3. 3.🖼️ Which picture file does the browser load?
   <img src="cake.jpg" alt="Birthday cake" width="250"> (a) moon.png (b) Birthday cake (c) cake.jpg (d) dog.jpg
4. 4.🔠 How many <h1> headings should a page usually have? (a) 3 (b) 10 (c) 6 (d) 1
5. 5.🔠 Which tag is used for the main title on a page? (a) <p> (b) <h1> (c) <h6> (d) <br>
6. 6.🔠 Which tag is the least important heading? (a) <h1> (b) <h6> (c) <h3> (d) <p>
7. 7.🔁 What does this code print?
   let temp = 43;
   if (temp < 29) {
     console.log("Hot");
   } else {
     console.log("Cool");
   } (a) Cool (b) Hot
8. 8.True or false: <caption> holds the whole table. (a) True (b) False
9. 9.Which of these is true of a code editor? (a) has an address bar (b) hosts websites online (c) answers page requests (d) shows line numbers
10. 10.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="kite.png" alt="A red kite" width="200"> (a) kite.png (b) A red kite (c) Map of India (d) width
11. 11.True or false: <input type="checkbox"> lets you tick many. (a) True (b) False
12. 12.Which of these goes in the head? (a) <h1> (b) <p> (c) <img> (d) <style>
13. 13.💪 Which justify-content value packs boxes at the end? (a) space-between (b) flex-start (c) flex-end (d) center
14. 14.⚡ Which JavaScript word makes a new variable? (a) alert() (b) let (c) for (d) if
15. 15.Which of these is margin? (a) space inside the border (b) the gap round content (c) the gap to other boxes (d) the line round the box
16. 16.📊 How many rows does this table have?
    <table>
      <tr><td>Orange</td><td>Litchi</td><td>Litchi</td></tr>
      <tr><td>Papaya</td><td>Mango</td><td>Guava</td></tr>
    </table>
17. 17.Which of these is a closing tag? (a) <body> (b) </h1> (c) <p> (d) <li>
18. 18.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
    .box {
      width: 290px;
      padding: 15px;
      border: 5px solid black;
      margin: 15px;
    }
19. 19.📋 Does this list show bullets or numbers?
    <ol>
      <li>Grapes</li>
      <li>Mango</li>
    </ol> (a) numbers (b) bullets
20. 20.⚖️ What colour is the text of this element?
    <h2 class="note" id="hero">Hi</h2>
    CSS:
    #hero { color: green; }
    .note { color: yellow; }
    h2 { color: blue; } (a) yellow (b) blue (c) white (d) green
21. 21.True or false: <ol> shows bullet points. (a) False (b) True
22. 22.⚡ What number does this code print?
    let runs = 7;
    runs = runs + 18;
    runs = runs - 23;
    console.log(runs);
23. 23.Which of these is safe to do online? (a) download from pop-ups (b) use a strong password (c) share your password (d) share your OTP
24. 24.🌐 Which one opens web pages for us? (a) a code editor (b) a web browser (c) a web server
25. 25.📝 Which tag gives a form box a name you can click? (a) <hr> (b) <title> (c) <h1> (d) <label>
26. 26.🚀 Which file should this code go in: h1 { font-size: 32px; } (a) script.js (b) index.html (c) style.css
27. 27.💬 Which text will NOT show on the page?
    <p>Our school trip</p>
    <p>Cricket is fun.</p>
    <!-- <p>My pets</p> -->
    <p>Fun facts</p> (a) Our school trip (b) Cricket is fun. (c) Fun facts (d) My pets
28. 28.🖌️ Where does the text sit on its line?
    li {
      text-align: left;
      background-color: green;
      font-size: 12px;
      color: black;
    } (a) in the middle (b) on the left (c) on the right
29. 29.📋 Which list tag shows bullet points? (a) <ol> (b) <li> (c) <ul>
30. 30.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="map.png" alt="Map of India" width="200"> (a) Birthday cake (b) Map of India (c) map.png (d) width
31. 31.💬 How many paragraphs show on the page?
    <!-- <p>Our school trip</p> -->
    <!-- <p>Rain today</p> -->
    <p>Hello, world!</p>
32. 32.What does background-color do? (a) makes letters bigger (b) colours behind the text (c) sets the letter colour (d) centres a heading
33. 33.🛡️ Online: is it safe to share your OTP? (a) safe (b) not safe
34. 34.True or false: <h1> is an empty tag. (a) False (b) True
35. 35.⚖️ Which selector is the weakest? (a) an element selector (b) an id selector (c) a class selector
36. 36.True or false: “link text “click here”” makes the page harder to use. (a) False (b) True
37. 37.🌍 What is the domain name in this URL?
    https://www.example.net/art/gallery.html (a) /art/gallery.html (b) https (c) learn.example.com (d) www.example.net
38. 38.🔍 Which is the odd one out? (a) gives the page structure (b) lays out the page (c) makes headings and lists (d) makes a form box
39. 39.📄 What is the big heading shown on this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>Riya’s Recipes</title>
    </head>
    <body>
      <h1>Match report</h1>
      <p>Try this poha.</p>
    </body>
    </html> (a) body (b) Match report (c) Try this poha. (d) Riya’s Recipes
40. 40.True or false: <li> lists things in any order. (a) True (b) False

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