Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 669 · 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 the lock (HTTPS) in the address bar mean? (a) the site is fast (b) the site is a game (c) the site is free (d) the data is scrambled
2. 2.📋 What number does the browser show next to “Orange”?
   <ol>
     <li>Guava</li>
     <li>Jamun</li>
     <li>Grapes</li>
     <li>Orange</li>
   </ol>
3. 3.🔁 What is the LAST number this code prints?
   for (let i = 0; i < 16; i = i + 4) {
     console.log(i);
   }
4. 4.📱 The screen is 414px wide. What font-size (px) does the paragraph get?
   p {
     font-size: 16px;
   }
   @media (max-width: 480px) {
     p {
       font-size: 14px;
     }
   }
5. 5.⚖️ Which selector is the strongest? (a) an element selector (b) a class selector (c) an id selector
6. 6.⚖️ What colour is the text of this element?
   <p class="red" id="top">Hi</p>
   CSS:
   .red { color: orange; }
   #top { color: purple; }
   p { color: blue; } (a) blue (b) purple (c) orange (d) red
7. 7.💬 Can anyone read your comments by viewing the page source? (a) No (b) Yes
8. 8.♿ Is this heading order correct (no level skipped)?
   <h1> → <h3> → <h3> → <h3> (a) Yes (b) No
9. 9.True or false: <caption> makes one table row. (a) False (b) True
10. 10.♿ A part of the page is under a <h4> heading. Which tag should its sub-heading use? (a) <h1> (b) <h5> (c) <h6> (d) <h3>
11. 11.📝 How many <input> tags are in this form?
    <form>
      <input type="checkbox">
      <input type="text">
      <input type="submit" value="Send">
    </form>
12. 12.🎯 What kind of selector is img? (a) an element selector (b) a class selector (c) an id selector
13. 13.🚀 Which file should this code go in: alert("Hi"); (a) script.js (b) style.css (c) index.html
14. 14.🔢 To build and share your first web page, which comes first: “write the HTML” or “add CSS styles”? (a) add CSS styles (b) write the HTML
15. 15.Which of these goes in the head? (a) <p> (b) <title> (c) <img> (d) <h1>
16. 16.✍️ Which property is set to 8px in this rule?
    .box {
      font-weight: bold;
      color: red;
      background-color: yellow;
      padding: 8px;
    } (a) padding (b) font-weight (c) 8px (d) border
17. 17.📊 Which tag makes one data cell? (a) <caption> (b) <table> (c) <td> (d) <tr>
18. 18.What does justify-content: space-between do? (a) packs boxes at the start (b) packs boxes at the end (c) equal gaps, none at ends (d) puts boxes in the middle
19. 19.📝 How many paragraphs does this code make?
    <p>Hello, world!</p>
    <h2>I love mangoes.</h2>
    <h2>Hello, world!</h2>
20. 20.🔗 Which address opens when you click this link?
    <a href="about.html">Maths fun</a> (a) https://example.com (b) about.html (c) Maths fun (d) contact.html
21. 21.What is <input type="email"> for? (a) is for an email address (b) sends the form (c) lets you tick many (d) hides what you type
22. 22.🖼️ Why do we add alt text to an image? (a) to make it bigger (b) to colour it (c) to describe the image (d) to load it faster
23. 23.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 3; i++) {
      total = total + i;
    }
    console.log(total);
24. 24.📝 How many paragraphs does this code make?
    <p>Hello, world!</p>
    <p>Rain today</p>
    <h2>Rain today</h2>
    <p>My best friend</p>
25. 25.📄 Where does <title> go: in the head or in the body? (a) in the head (b) in the body
26. 26.What is <input type="password"> for? (a) hides what you type (b) lets you tick many (c) sends the form (d) lets you pick only one
27. 27.💪 Which flexbox property picks row or column? (a) align-items (b) justify-content (c) display: flex (d) flex-direction
28. 28.⚡ What number does this code print?
    let a = 9;
    let b = 2;
    console.log(a * b);
29. 29.📄 What is the first line of an HTML5 page? (a) <!DOCTYPE html> (b) <body> (c) <head> (d) <html>
30. 30.What does font-family do? (a) colours behind the text (b) makes letters bigger (c) centres a heading (d) picks the font style
31. 31.📱 The screen is 1100px wide. Does the rule inside @media apply?
    p {
      font-size: 24px;
    }
    @media (min-width: 600px) {
      p {
        font-size: 32px;
      }
    } (a) Yes (b) No
32. 32.True or false: #main is an element selector. (a) False (b) True
33. 33.True or false: <footer> is the page’s key part. (a) False (b) True
34. 34.Which of these is not safe to do online? (a) keep passwords secret (b) meet an online stranger (c) ask before downloading (d) think before you post
35. 35.What does justify-content: flex-end do? (a) packs boxes at the end (b) equal gaps, none at ends (c) packs boxes at the start (d) puts boxes in the middle
36. 36.🔗 Which tag makes a clickable link? (a) <p> (b) <img> (c) <a> (d) <link>
37. 37.True or false: <li> is an unordered list. (a) False (b) True
38. 38.🔗 Which address opens when you click this link?
    <a href="https://example.com">Contact us</a> (a) art.html (b) maths.html (c) https://example.com (d) Contact us
39. 39.True or false: a code editor saves our .html files. (a) False (b) True
40. 40.🔗 Where does this link open?
    <a href="art.html">Art corner</a> (a) in a new tab (b) in the same tab

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