Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 988 · 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.🖌️ Which CSS property makes the text bold? (a) font-family (b) font-weight (c) text-align (d) color
2. 2.💬 How many paragraphs show on the page?
   <p>I love mangoes.</p>
   <!-- <p>Good morning!</p> -->
   <!-- <p>Rain today</p> -->
   <!-- <p>Fun facts</p> -->
3. 3.🚀 Which file should this code go in: <h1>My Site</h1> (a) index.html (b) style.css (c) script.js
4. 4.📋 How many items does this list show?
   <ol>
     <li>Papaya</li>
     <li>Orange</li>
   </ol>
5. 5.Which of these is a weak password? (a) abcd1234 (b) Kite_Fl1es@Dawn (c) Mango#Kite29! (d) Blue@Tiger_74
6. 6.🔢 To build and share your first web page, which comes LAST? (a) plan what to show (b) test in a browser (c) add CSS styles (d) publish it online
7. 7.♿ Who uses a screen reader? (a) people who are blind (b) only teachers (c) only coders (d) only robots
8. 8.🖼️ The picture cannot load. Which text does the browser show instead?
   <img src="map.png" alt="Map of India" width="200"> (a) map.png (b) Birthday cake (c) width (d) Map of India
9. 9.📄 What is the big heading shown on this page?
   <!DOCTYPE html>
   <html>
   <head>
     <title>Class 7 Blog</title>
   </head>
   <body>
     <h1>Easy snacks</h1>
     <p>Thanks for visiting.</p>
   </body>
   </html> (a) Easy snacks (b) Thanks for visiting. (c) Class 7 Blog (d) body
10. 10.True or false: <caption> gives the table a title. (a) True (b) False
11. 11.🎯 Which CSS selector matches this element?
    <h1 class="box" id="top">Hello</h1> (a) #intro (b) .star (c) #top (d) #box
12. 12.True or false: <img src="cat.png"> goes in index.html. (a) False (b) True
13. 13.True or false: #top is an element selector. (a) False (b) True
14. 14.🌍 Which one stores the site’s files? (a) the browser (b) the URL (c) the server (d) HTTPS
15. 15.📊 How many rows does this table have?
    <table>
      <tr><td>Grapes</td><td>Banana</td></tr>
      <tr><td>Litchi</td><td>Litchi</td></tr>
    </table>
16. 16.⚖️ What colour is the text of this element?
    <p class="red" id="main">Hi</p>
    CSS:
    p { color: black; }
    #main { color: red; }
    .red { color: orange; } (a) green (b) red (c) black (d) orange
17. 17.📄 Where does <style> go: in the head or in the body? (a) in the head (b) in the body
18. 18.🔗 Which tag makes a clickable link? (a) <p> (b) <a> (c) <img> (d) <link>
19. 19.🎯 What kind of selector is #top? (a) a class selector (b) an element selector (c) an id selector
20. 20.📋 What number does the browser show next to “Litchi”?
    <ol>
      <li>Papaya</li>
      <li>Jamun</li>
      <li>Litchi</li>
    </ol>
21. 21.True or false: <input type="radio"> lets you pick only one. (a) True (b) False
22. 22.🖼️ How many pixels wide is the picture drawn?
    <img src="bus.jpg" alt="Our school bus" width="350">
23. 23.📋 Which list tag shows 1, 2, 3 numbers? (a) <ol> (b) <li> (c) <ul>
24. 24.💬 How many paragraphs show on the page?
    <p>Rain today</p>
    <!-- <p>Fun facts</p> -->
    <p>My best friend</p>
25. 25.⚡ What number does this code print?
    let a = 31;
    let b = 11;
    console.log(a - b);
26. 26.🖼️ Which attribute of <img> names the picture file? (a) width (b) alt (c) height (d) src
27. 27.⚡ What does this code show?
    let name = "Arjun";
    console.log("Hi, " + name + "!"); (a) Hi, Arjun! (b) Arjun (c) name (d) Hi, name!
28. 28.📋 What number does the browser show next to “Litchi”?
    <ol start="5">
      <li>Grapes</li>
      <li>Guava</li>
      <li>Litchi</li>
      <li>Mango</li>
    </ol>
29. 29.True or false: HTML on its own cannot make headings. (a) False (b) True
30. 30.⚖️ What colour is the text of this element?
    <h2 class="box" id="logo">Hi</h2>
    CSS:
    .box { color: white; }
    .box { color: purple; } (a) white (b) green (c) red (d) purple
31. 31.📋 How many items does this list show?
    <ol>
      <li>Grapes</li>
      <li>Jamun</li>
      <li>Litchi</li>
      <li>Papaya</li>
    </ol>
32. 32.🌈 Which colour of light is strongest in rgb(3, 229, 111)? (a) green (b) blue (c) red
33. 33.🚀 You change your code. What should you do to see the change? (a) save and refresh (b) switch off the PC (c) delete the file (d) rename the folder
34. 34.📄 What does the browser tab show for this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>Art Gallery</title>
    </head>
    <body>
      <h1>My drawings</h1>
      <p>Mars is red.</p>
    </body>
    </html> (a) index.html (b) My drawings (c) Art Gallery (d) Mars is red.
35. 35.📱 The screen is 820px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (min-width: 480px) {
      p {
        font-size: 16px;
      }
    }
36. 36.💬 Which text will NOT show on the page?
    <p>My best friend</p>
    <!-- <p>My pets</p> -->
    <p>Good morning!</p> (a) My pets (b) Good morning! (c) My best friend
37. 37.⚖️ Which selector is the strongest? (a) an element selector (b) an id selector (c) a class selector
38. 38.True or false: <li> is one item of a list. (a) True (b) False
39. 39.💬 Can anyone read your comments by viewing the page source? (a) No (b) Yes
40. 40.🔗 Which address opens when you click this link?
    <a href="about.html">Contact us</a> (a) https://example.com (b) contact.html (c) Contact us (d) about.html

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