Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 58 · 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 tag is used for the main title on a page? (a) <br> (b) <h1> (c) <h6> (d) <p>
2. 2.🔗 Which words do you click on?
   <a href="contact.html">About us</a> (a) href (b) Contact us (c) About us (d) contact.html
3. 3.📱 The screen is 820px wide. What font-size (px) does the paragraph get?
   p {
     font-size: 20px;
   }
   @media (min-width: 768px) {
     p {
       font-size: 24px;
     }
   }
4. 4.📋 What number does the browser show next to “Mango”?
   <ol>
     <li>Jamun</li>
     <li>Mango</li>
     <li>Litchi</li>
   </ol>
5. 5.⚖️ What colour is the text of this element?
   <h1 class="note" id="main">Hi</h1>
   CSS:
   #main { color: blue; }
   h1 { color: yellow; }
   .note { color: red; } (a) blue (b) red (c) yellow (d) purple
6. 6.⚡ Which JavaScript word runs code when true? (a) let (b) alert() (c) console.log() (d) if
7. 7.🏷️ Which is the closing tag for <h3>? (a) <h3> (b) <\h3> (c) <h3/> (d) </h3>
8. 8.⚖️ What colour is the text of this element?
   <p class="star" id="hero">Hi</p>
   CSS:
   p { color: orange; }
   #hero { color: green; } (a) orange (b) yellow (c) green (d) white
9. 9.🌈 What is the biggest number one colour can have in rgb()? (a) 99 (b) 1000 (c) 100 (d) 255
10. 10.⚖️ Which selector is the weakest? (a) an id selector (b) an element selector (c) a class selector
11. 11.🚀 Which file is best for code that reacts to clicks? (a) index.html (b) script.js (c) notes.txt (d) style.css
12. 12.📱 The screen is 540px wide. Does the rule inside @media apply?
    p {
      font-size: 16px;
    }
    @media (min-width: 480px) {
      p {
        font-size: 20px;
      }
    } (a) No (b) Yes
13. 13.📄 What does the browser tab show for this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>Art Gallery</title>
    </head>
    <body>
      <h1>Welcome!</h1>
      <p>I like to read.</p>
    </body>
    </html> (a) I like to read. (b) Art Gallery (c) index.html (d) Welcome!
14. 14.🚀 Which file should this code go in: <p>Hello!</p> (a) script.js (b) index.html (c) style.css
15. 15.True or false: margin is the gap round content. (a) False (b) True
16. 16.🎨 What does CSS stand for? (a) Computer Style Sheets (b) Creative Sheet System (c) Colourful Site Styles (d) Cascading Style Sheets
17. 17.📊 How many cells are in each row?
    <table>
      <tr><td>Jamun</td><td>Litchi</td></tr>
      <tr><td>Papaya</td><td>Banana</td></tr>
      <tr><td>Orange</td><td>Banana</td></tr>
    </table>
18. 18.🌍 Which one shows the page to you? (a) the URL (b) the browser (c) HTTPS (d) the server
19. 19.💬 How many paragraphs show on the page?
    <!-- <p>Our school trip</p> -->
    <p>Hello, world!</p>
    <!-- <p>My pets</p> -->
20. 20.💬 Which text will NOT show on the page?
    <p>Rain today</p>
    <p>My pets</p>
    <!-- <p>Hello, world!</p> --> (a) Hello, world! (b) My pets (c) Rain today
21. 21.♿ Does this help everyone, or make the page harder to use: use headings in order? (a) makes it harder (b) helps everyone
22. 22.🎯 Which CSS selector matches this element?
    <h2 class="big" id="hero">Hello</h2> (a) #top (b) .red (c) h2 (d) #big
23. 23.🧭 Who is helped most by semantic tags? (a) nobody (b) only the server (c) only the printer (d) screen-reader users
24. 24.🖼️ Which picture file does the browser load?
    <img src="tiger.jpg" alt="A tiger asleep" width="100"> (a) kite.png (b) tiger.jpg (c) map.png (d) A tiger asleep
25. 25.📊 How many heading cells (<th>) does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th></tr>
      <tr><td>Banana</td><td>Guava</td><td>Guava</td></tr>
      <tr><td>Mango</td><td>Guava</td><td>Litchi</td></tr>
      <tr><td>Papaya</td><td>Guava</td><td>Orange</td></tr>
    </table>
26. 26.What does font-family do? (a) picks the font style (b) sets the letter colour (c) centres a heading (d) colours behind the text
27. 27.🖌️ Where does the text sit on its line?
    h1 {
      text-align: left;
      font-size: 24px;
      background-color: green;
      color: black;
    } (a) on the right (b) on the left (c) in the middle
28. 28.⚖️ Which selector is the strongest? (a) a class selector (b) an element selector (c) an id selector
29. 29.💬 How many paragraphs show on the page?
    <p>My pets</p>
    <p>I love mangoes.</p>
    <p>Fun facts</p>
    <!-- <p>The red kite</p> -->
    <p>Hello, world!</p>
30. 30.📱 The screen is 320px wide. Does the rule inside @media apply?
    p {
      font-size: 16px;
    }
    @media (min-width: 768px) {
      p {
        font-size: 24px;
      }
    } (a) Yes (b) No
31. 31.True or false: <meta charset="utf-8"> goes in the head. (a) True (b) False
32. 32.📝 Which input type is for an email address? (a) radio (b) number (c) password (d) email
33. 33.🎯 Which sign starts an id selector? (a) & (b) @ (c) . (d) #
34. 34.📝 How many <input> tags are in this form?
    <form>
      <input type="number">
      <input type="text">
      <input type="password">
      <input type="email">
      <input type="checkbox">
      <input type="submit" value="Send">
    </form>
35. 35.True or false: <a> goes in the head. (a) True (b) False
36. 36.What is <input type="radio"> for? (a) hides what you type (b) lets you tick many (c) lets you pick only one (d) is for an email address
37. 37.🖌️ What colour are the letters?
    p {
      font-size: 24px;
      color: red;
      background-color: white;
      text-align: left;
    } (a) green (b) red (c) white
38. 38.📱 What does a media query check? (a) the time of day (b) the battery level (c) the page title (d) the screen width
39. 39.📝 Does <ul> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
40. 40.Which of these is a strong password? (a) 123456 (b) Chai$Cup_19x (c) password (d) 111111

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