Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 271 · 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.🖼️ The picture cannot load. Which text does the browser show instead?
   <img src="tiger.jpg" alt="A tiger asleep" width="50"> (a) width (b) A tiger asleep (c) tiger.jpg (d) A red kite
2. 2.Which of these is a closing tag? (a) <li> (b) </title> (c) <b> (d) <p>
3. 3.🎯 Which CSS selector matches this element?
   <div class="box" id="intro">Hello</div> (a) #main (b) .star (c) #box (d) .box
4. 4.🖼️ Why do we add alt text to an image? (a) to make it bigger (b) to colour it (c) to load it faster (d) to describe the image
5. 5.🖼️ The picture cannot load. Which text does the browser show instead?
   <img src="fort.jpg" alt="An old fort" width="350"> (a) fort.jpg (b) width (c) A tiger asleep (d) An old fort
6. 6.📋 Which list shows the steps of a recipe best? (a) <ol> (b) <br> (c) <hr> (d) <ul>
7. 7.📄 What is the first line of an HTML5 page? (a) <html> (b) <body> (c) <head> (d) <!DOCTYPE html>
8. 8.💪 How much empty space (px) is before the first box?
   .row {
     display: flex;
     width: 170px;
     justify-content: flex-end;
   }
   Inside are 3 boxes, each 40px wide (no margins).
9. 9.Which of these is true of <main>? (a) holds a news story (b) holds one blog post (c) holds the main content (d) holds a side box of tips
10. 10.✍️ What is the selector in this CSS rule?
    #top {
      padding: 8px;
      font-weight: bold;
      border: 2px solid;
      color: red;
    } (a) bold (b) #top (c) li (d) padding
11. 11.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="cake.jpg" alt="Birthday cake" width="350"> (a) width (b) A happy dog (c) cake.jpg (d) Birthday cake
12. 12.📱 Responsive design means a page ___. (a) never changes (b) is only for laptops (c) fits every screen (d) has no pictures
13. 13.⚡ What number does this code print?
    let coins = 7;
    coins = coins + 7;
    coins = coins - 6;
    console.log(coins);
14. 14.🌗 Is black on white easy or hard to read? (a) easy to read (b) hard to read
15. 15.📝 Does <input> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
16. 16.True or false: HTML on its own can make tables. (a) True (b) False
17. 17.💪 Which justify-content value packs boxes at the start? (a) space-between (b) flex-start (c) flex-end (d) center
18. 18.🌈 Hex digits go 0 to 9, then A to which letter? (a) J (b) G (c) F (d) Z
19. 19.True or false: the border is a solid or dotted edge. (a) False (b) True
20. 20.🌈 Which colour is #0000ff? (a) black (b) yellow (c) red (d) blue
21. 21.⚡ Which tag holds JavaScript in a page? (a) <js> (b) <code> (c) <script> (d) <style>
22. 22.📋 Does this list show bullets or numbers?
    <ol>
      <li>Mango</li>
      <li>Jamun</li>
    </ol> (a) bullets (b) numbers
23. 23.🌈 Which hex code is bright green? (a) #00ff00 (b) #ffff00 (c) #ffffff (d) #ff0000
24. 24.True or false: body is an element selector. (a) True (b) False
25. 25.🌍 What is the domain name in this URL?
    http://school.example.in/games/chess.html (a) http (b) /games/chess.html (c) www.example.net (d) school.example.in
26. 26.🖌️ Which CSS property colours behind the text? (a) background-color (b) font-size (c) font-weight (d) font-family
27. 27.📝 Does <img> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
28. 28.🖌️ Which CSS property centres a heading? (a) font-weight (b) text-align (c) color (d) font-family
29. 29.🚀 Which program lets you see your web page while you build it? (a) a calculator (b) a photo viewer (c) a web browser (d) a music player
30. 30.📄 Where does the text of <title> appear? (a) on the browser tab (b) nowhere (c) in a big heading (d) at the bottom
31. 31.🛡️ A pop-up says you won a prize and asks for your password. What do you do? (a) click it twice (b) close it, tell an adult (c) type the password (d) share it with friends
32. 32.📋 Which list tag is an unordered list? (a) <ul> (b) <li> (c) <ol>
33. 33.🛡️ Is it safe to use the same password on every site? (a) No (b) Yes
34. 34.📄 Where does <title> go: in the head or in the body? (a) in the body (b) in the head
35. 35.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 380px;
      justify-content: flex-start;
    }
    Inside are 3 boxes, each 100px wide (no margins).
36. 36.Which of these is safe to do online? (a) share your OTP (b) think before you post (c) share your password (d) type a password on http
37. 37.💪 How wide (px) is each gap between two boxes?
    .row {
      display: flex;
      width: 290px;
      justify-content: space-between;
    }
    Inside are 4 boxes, each 50px wide (no margins).
38. 38.True or false: in <img>, alt shows if the image fails. (a) True (b) False
39. 39.🔗 Which address opens when you click this link?
    <a href="maths.html">About us</a> (a) news.html (b) art.html (c) maths.html (d) About us
40. 40.📱 The screen is 1366px wide. Does the rule inside @media apply?
    p {
      font-size: 20px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 14px;
      }
    } (a) Yes (b) No

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