Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 248 · 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.🖼️ Why do we add alt text to an image? (a) to describe the image (b) to make it bigger (c) to load it faster (d) to colour it
2. 2.🔍 Which line is missing its closing tag?
   line 1: <u>Rain today</u>
   line 2: <h2>My best friend
   line 3: <strong>Fun facts</strong> (a) line 3 (b) line 1 (c) line 2
3. 3.⚡ What does this code show?
   let name = "Aman";
   alert("Hello, " + name + "!"); (a) Hello, name! (b) Hello, Aman! (c) name (d) Aman
4. 4.🖼️ Which tag puts a picture on a page? (a) <pic> (b) <a> (c) <p> (d) <img>
5. 5.🔗 Which code links to about.html? (a) <a alt="about.html"> (b) <link about.html> (c) <a src="about.html"> (d) <a href="about.html">
6. 6.📄 Can HTML on its own show paragraphs? (a) Yes (b) No
7. 7.🔁 What number does this code print?
   let total = 0;
   for (let i = 1; i <= 3; i++) {
     total = total + i;
   }
   console.log(total);
8. 8.⚖️ What colour is the text of this element?
   <p class="note" id="intro">Hi</p>
   CSS:
   .note { color: red; }
   .note { color: yellow; } (a) red (b) yellow (c) purple (d) orange
9. 9.🖌️ What colour is behind the letters?
   li {
     background-color: green;
     text-align: right;
     font-size: 28px;
     color: blue;
   } (a) black (b) blue (c) green
10. 10.🔗 Which address opens when you click this link?
    <a href="https://example.com">Take the quiz</a> (a) art.html (b) Take the quiz (c) https://example.com (d) maths.html
11. 11.Which colour pair is hard to read? (a) yellow on black (b) dark grey on white (c) white on dark blue (d) pink on red
12. 12.🎯 Which element does the selector span style? (a) <h1 class="red"> (b) <h2 id="intro"> (c) <p> (d) <span class="red">
13. 13.True or false: <link rel="stylesheet"> goes in the head. (a) False (b) True
14. 14.📝 How many <input> tags are in this form?
    <form>
      <input type="checkbox">
      <input type="date">
      <input type="text">
      <input type="number">
      <input type="email">
      <input type="submit" value="Send">
    </form>
15. 15.🔗 Which words do you click on?
    <a href="art.html">Take the quiz</a> (a) href (b) Play games (c) Take the quiz (d) art.html
16. 16.📝 What does <hr> draw? (a) a link (b) a line across the page (c) a picture (d) a table
17. 17.⚡ What number does this code print?
    let apples = 23;
    apples = apples + 5;
    apples = apples - 12;
    console.log(apples);
18. 18.🎯 Which element does the selector h2 style? (a) <div class="star"> (b) <li> (c) <h2 class="star"> (d) <span id="intro">
19. 19.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
    .box {
      width: 90px;
      padding: 15px;
      border: 4px solid black;
      margin: 20px;
    }
20. 20.📝 How many paragraphs does this code make?
    <p>My best friend</p>
    <h2>The red kite</h2>
    <h2>Hello, world!</h2>
    <h2>Hello, world!</h2>
    <p>My pets</p>
    <p>My pets</p>
21. 21.True or false: #top is a class selector. (a) True (b) False
22. 22.✍️ What value is given to margin in this rule?
    li {
      margin: 10px;
      font-style: italic;
    } (a) margin (b) 8px (c) bold (d) 10px
23. 23.✍️ Which sign goes between a property and its value? (a) = (b) ; (c) - (d) :
24. 24.🔗 Where does this link open?
    <a href="games.html">School news</a> (a) in a new tab (b) in the same tab
25. 25.🧭 Why use <nav> instead of <div> for a menu? (a) it tells its meaning (b) it makes text red (c) it loads faster (d) it adds pictures
26. 26.🔠 Which heading shows the BIGGEST text: <h1>, <h3>, <h4> or <h6>? (a) <h4> (b) <h6> (c) <h3> (d) <h1>
27. 27.✍️ How many declarations (property: value pairs) are in this rule?
    .note {
      font-style: italic;
    }
28. 28.🏷️ Which is the closing tag for <small>? (a) </small> (b) <\small> (c) <small/> (d) <small>
29. 29.🎯 Which element does the selector .star style? (a) <span class="menu"> (b) <span id="star"> (c) <span class="star"> (d) <p class="note">
30. 30.🔢 To build and share your first web page, what comes right after “write the HTML”? (a) add CSS styles (b) test in a browser (c) publish it online (d) plan what to show
31. 31.🔠 Which tag is the least important heading? (a) <h1> (b) <h3> (c) <h6> (d) <p>
32. 32.🏷️ What does a closing tag have that an opening tag does not? (a) a hash # (b) a dollar $ (c) a dot . (d) a slash /
33. 33.What does font-weight do? (a) centres a heading (b) makes the text bold (c) colours behind the text (d) picks the font style
34. 34.📄 What is the first line of an HTML5 page? (a) <html> (b) <head> (c) <body> (d) <!DOCTYPE html>
35. 35.True or false: in <img>, alt shows if the image fails. (a) True (b) False
36. 36.True or false: <tr> holds the whole table. (a) True (b) False
37. 37.🎨 Which attribute adds CSS inside one tag? (a) src (b) href (c) style (d) alt
38. 38.🔠 Which heading shows the BIGGEST text: <h1>, <h5>, <h4> or <h3>? (a) <h1> (b) <h3> (c) <h5> (d) <h4>
39. 39.📱 The screen is 320px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (min-width: 768px) {
      p {
        font-size: 16px;
      }
    }
40. 40.💬 How many paragraphs show on the page?
    <!-- <p>I love mangoes.</p> -->
    <p>Hello, world!</p>
    <p>Cricket is fun.</p>

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