Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 661 · 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 times does this code print “Welcome”?
   for (let i = 0; i <= 3; i++) {
     console.log("Welcome");
   }
2. 2.🌈 Which colour of light is strongest in rgb(0, 36, 183)? (a) red (b) blue (c) green
3. 3.🔗 Which address opens when you click this link?
   <a href="maths.html">Art corner</a> (a) Art corner (b) news.html (c) art.html (d) maths.html
4. 4.⚖️ What colour is the text of this element?
   <h2 class="box" id="hero">Hi</h2>
   CSS:
   .box { color: yellow; }
   #hero { color: purple; } (a) yellow (b) purple (c) blue (d) green
5. 5.✍️ How many declarations (property: value pairs) are in this rule?
   h1 {
     font-size: 20px;
   }
6. 6.🔗 Which words do you click on?
   <a href="contact.html">Art corner</a> (a) href (b) Art corner (c) School news (d) contact.html
7. 7.📋 How many items does this list show?
   <ol>
     <li>Litchi</li>
     <li>Jamun</li>
     <li>Orange</li>
     <li>Guava</li>
     <li>Grapes</li>
   </ol>
8. 8.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
   .box {
     width: 300px;
     padding: 5px;
     border: 2px solid black;
     margin: 0px;
   }
9. 9.💪 How much empty space (px) is before the first box?
   .row {
     display: flex;
     width: 200px;
     justify-content: flex-end;
   }
   Inside are 2 boxes, each 60px wide (no margins).
10. 10.🔠 Which tag is used for the main title on a page? (a) <h1> (b) <p> (c) <br> (d) <h6>
11. 11.True or false: let score = 0; goes in script.js. (a) False (b) True
12. 12.🖼️ Which tag puts a picture on a page? (a) <pic> (b) <a> (c) <p> (d) <img>
13. 13.🔢 On a typical page, from top to bottom, what comes right after “<header>”? (a) <footer> (b) <main> (c) <nav>
14. 14.🔒 Is the connection to this address scrambled (encrypted)?
    https://kids.example.org/index.html (a) Yes (b) No
15. 15.True or false: in <img>, src names the picture file. (a) True (b) False
16. 16.♿ Does this help everyone, or make the page harder to use: write clear link text? (a) helps everyone (b) makes it harder
17. 17.🖌️ What colour are the letters?
    h1 {
      text-align: left;
      font-size: 16px;
      color: orange;
      background-color: white;
    } (a) orange (b) red (c) white
18. 18.🔠 Which heading shows the BIGGEST text: <h6>, <h1>, <h3> or <h2>? (a) <h2> (b) <h3> (c) <h1> (d) <h6>
19. 19.✍️ In color: blue; which part is the value? (a) ; (b) color (c) blue (d) :
20. 20.🖼️ Which picture file does the browser load?
    <img src="cake.jpg" alt="Birthday cake" width="100"> (a) dog.jpg (b) cake.jpg (c) moon.png (d) Birthday cake
21. 21.📱 min-width: 800px applies when the screen is ___. (a) exactly 100px (b) turned off (c) 800px or wider (d) 800px or narrower
22. 22.True or false: the server stores the site’s files. (a) False (b) True
23. 23.🖼️ Which attribute of <img> tells which image to load? (a) width (b) height (c) src (d) alt
24. 24.🏷️ Every HTML tag starts with which sign? (a) [ (b) ( (c) < (d) {
25. 25.🔗 Where does this link open?
    <a href="about.html">About us</a> (a) in the same tab (b) in a new tab
26. 26.♿ Is this heading order correct (no level skipped)?
    <h1> → <h2> → <h2> → <h2> (a) Yes (b) No
27. 27.🔗 Which address opens when you click this link?
    <a href="https://example.com">Contact us</a> (a) art.html (b) https://example.com (c) maths.html (d) Contact us
28. 28.💬 How many paragraphs show on the page?
    <p>Fun facts</p>
    <p>Our school trip</p>
    <!-- <p>Good morning!</p> -->
    <p>Rain today</p>
    <p>Hello, world!</p>
29. 29.💬 Which text will NOT show on the page?
    <!-- <p>Good morning!</p> -->
    <p>The red kite</p>
    <p>Cricket is fun.</p> (a) The red kite (b) Good morning! (c) Cricket is fun.
30. 30.📝 Which input type hides what you type? (a) email (b) password (c) checkbox (d) submit
31. 31.📱 The screen is 320px wide. Does the rule inside @media apply?
    p {
      font-size: 16px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 12px;
      }
    } (a) Yes (b) No
32. 32.What does justify-content: flex-start 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
33. 33.Which of these is safe to do online? (a) type a password on http (b) put secrets in comments (c) think before you post (d) download from pop-ups
34. 34.🏷️ Which is the closing tag for <u>? (a) <\u> (b) <u/> (c) </u> (d) <u>
35. 35.📊 How many heading cells (<th>) does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th><th>Day</th></tr>
      <tr><td>Litchi</td><td>Banana</td><td>Banana</td><td>Guava</td></tr>
    </table>
36. 36.📝 Which input type is for an email address? (a) password (b) email (c) checkbox (d) radio
37. 37.🔢 To build and share your first web page, what comes right after “test in a browser”? (a) write the HTML (b) add CSS styles (c) plan what to show (d) publish it online
38. 38.True or false: <h1>My Site</h1> goes in index.html. (a) False (b) True
39. 39.🔁 When does the else part run? (a) when if is false (b) always (c) never (d) when if is true
40. 40.📄 Which part holds everything you see on the page? (a) the head (b) the title (c) the body (d) the doctype

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