Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 106 · 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.True or false: <meta charset="utf-8"> goes in the head. (a) True (b) False
2. 2.✍️ How does a CSS comment start? (a) <!-- (b) /* (c) // (d) #
3. 3.🖼️ Which tag puts a picture on a page? (a) <pic> (b) <a> (c) <p> (d) <img>
4. 4.📊 How many heading cells (<th>) does this table have?
   <table>
     <tr><th>Name</th><th>Fruit</th><th>Price</th></tr>
     <tr><td>Orange</td><td>Jamun</td><td>Litchi</td></tr>
     <tr><td>Guava</td><td>Orange</td><td>Papaya</td></tr>
   </table>
5. 5.📱 The screen is 540px wide. Does the rule inside @media apply?
   p {
     font-size: 20px;
   }
   @media (min-width: 1024px) {
     p {
       font-size: 22px;
     }
   } (a) No (b) Yes
6. 6.🔍 Which line is missing its closing tag?
   line 1: <h3>I love mangoes.</h3>
   line 2: <h1>Cricket is fun.</h1>
   line 3: <small>Hello, world! (a) line 3 (b) line 1 (c) line 2
7. 7.True or false: <th> gives the table a title. (a) False (b) True
8. 8.📝 At most, how many of these can be chosen at the same time?
   <form>
     <input type="radio" name="sport"> Cricket
     <input type="radio" name="sport"> Chess
     <input type="radio" name="sport"> Football
     <input type="radio" name="sport"> Kabaddi
   </form>
9. 9.✍️ CSS declarations go inside which brackets? (a) { } (b) < > (c) [ ] (d) ( )
10. 10.💬 Does the browser show comments on the page? (a) Yes (b) No
11. 11.🎯 Which CSS selector matches this element?
    <li class="star" id="end">Hello</li> (a) #star (b) li (c) .menu (d) .end
12. 12.🔗 What does target="_blank" do to a link? (a) hides the link (b) makes it bold (c) opens it in a new tab (d) makes it blank
13. 13.🏷️ Which is the closing tag for <h3>? (a) <\h3> (b) <h3/> (c) <h3> (d) </h3>
14. 14.🔠 Which heading shows the SMALLEST text: <h5>, <h4>, <h2> or <h3>? (a) <h4> (b) <h5> (c) <h3> (d) <h2>
15. 15.🔢 When you open a web page, what comes right after “the server sends files”? (a) you type the URL (b) the browser shows it (c) DNS finds the server (d) the browser asks it
16. 16.🔁 What does i++ do? (a) prints i (b) takes 1 from i (c) adds 1 to i (d) doubles i
17. 17.True or false: HTML on its own can add up two numbers. (a) False (b) True
18. 18.📦 In the box model, which part is the gap round content? (a) content (b) padding (c) margin (d) border
19. 19.🔠 How many headings are in this code?
    <h1>Hello, world!</h1>
    <h2>Good morning!</h2>
    <p>The red kite</p>
    <p>Fun facts</p>
    <h2>The red kite</h2>
20. 20.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 220px;
      padding: 15px;
      border: 5px solid black;
      margin: 5px;
    }
21. 21.💬 Can anyone read your comments by viewing the page source? (a) No (b) Yes
22. 22.📄 What does the browser tab show for this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>Class 7 Blog</title>
    </head>
    <body>
      <h1>Welcome!</h1>
      <p>Here is my best one.</p>
    </body>
    </html> (a) Class 7 Blog (b) Welcome! (c) index.html (d) Here is my best one.
23. 23.Which of these is true of <main>? (a) holds the main content (b) holds the menu of links (c) sits at the very top (d) holds a side box of tips
24. 24.🖌️ Which CSS property sets the letter colour? (a) font-size (b) text-align (c) color (d) font-weight
25. 25.📋 Which list tag is an unordered list? (a) <ol> (b) <li> (c) <ul>
26. 26.True or false: “colour as the only clue” helps everyone use the page. (a) False (b) True
27. 27.💬 How many paragraphs show on the page?
    <p>My pets</p>
    <p>Rain today</p>
    <!-- <p>Hello, world!</p> -->
28. 28.🔠 Which heading shows the SMALLEST text: <h2>, <h3>, <h6> or <h1>? (a) <h3> (b) <h6> (c) <h1> (d) <h2>
29. 29.Which of these is an opening tag? (a) </h1> (b) <p> (c) </body> (d) </p>
30. 30.🔗 Where does this link open?
    <a href="https://example.com" target="_blank">About us</a> (a) in the same tab (b) in a new tab
31. 31.📱 The screen is 375px wide. Does the rule inside @media apply?
    p {
      font-size: 12px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 10px;
      }
    } (a) No (b) Yes
32. 32.🎯 Which CSS selector matches this element?
    <h1 class="note" id="logo">Hello</h1> (a) #note (b) #logo (c) #end (d) h2
33. 33.✍️ What is the selector in this CSS rule?
    .box {
      font-weight: bold;
      font-style: italic;
    } (a) h2 (b) font-weight (c) .box (d) italic
34. 34.True or false: <p> goes in the head. (a) True (b) False
35. 35.Which of these is a strong password? (a) 123456 (b) password (c) riya2014 (d) Rain#Drop_42!
36. 36.🔠 Which tag is used for the main title on a page? (a) <br> (b) <h1> (c) <p> (d) <h6>
37. 37.🔗 Which address opens when you click this link?
    <a href="about.html">Art corner</a> (a) contact.html (b) https://example.com (c) Art corner (d) about.html
38. 38.📝 At most, how many of these can be chosen at the same time?
    <form>
      <input type="radio" name="colour"> Orange
      <input type="radio" name="colour"> Green
      <input type="radio" name="colour"> Blue
      <input type="radio" name="colour"> Red
    </form>
39. 39.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 100px;
      padding: 15px;
      border: 1px solid black;
      margin: 20px;
    }
40. 40.True or false: in <img>, width sets how wide it is. (a) True (b) False

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