Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 979 · 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.True or false: <meta charset="utf-8"> goes in the head. (a) False (b) True
2. 2.⚡ Which tag holds JavaScript in a page? (a) <code> (b) <js> (c) <script> (d) <style>
3. 3.📄 Can HTML on its own make links to pages? (a) No (b) Yes
4. 4.📄 What is the big heading shown on this page?
   <!DOCTYPE html>
   <html>
   <head>
     <title>Space Facts</title>
   </head>
   <body>
     <h1>Welcome!</h1>
     <p>I like to read.</p>
   </body>
   </html> (a) Welcome! (b) I like to read. (c) body (d) Space Facts
5. 5.💪 How much empty space (px) is before the first box?
   .row {
     display: flex;
     width: 160px;
     justify-content: flex-end;
   }
   Inside are 2 boxes, each 50px wide (no margins).
6. 6.True or false: the border is the line round the box. (a) True (b) False
7. 7.⚖️ What colour is the text of this element?
   <p class="note" id="intro">Hi</p>
   CSS:
   .note { color: purple; }
   .note { color: green; } (a) red (b) black (c) purple (d) green
8. 8.🔗 Which address opens when you click this link?
   <a href="maths.html">About us</a> (a) news.html (b) About us (c) maths.html (d) art.html
9. 9.📄 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) Mars is red. (d) Art Gallery
10. 10.💪 How wide (px) is each gap between two boxes?
    .row {
      display: flex;
      width: 380px;
      justify-content: space-between;
    }
    Inside are 4 boxes, each 50px wide (no margins).
11. 11.🧩 Which language gives the page structure? (a) CSS (b) JavaScript (c) HTML
12. 12.⚡ What does JavaScript add to a web page? (a) only colours (b) the page title (c) the domain name (d) actions and changes
13. 13.💬 How does an HTML comment start? (a) <!-- (b) /* (c) // (d) #
14. 14.True or false: <meta> is an empty tag. (a) True (b) False
15. 15.🛡️ Online: is it safe to type a password on http? (a) not safe (b) safe
16. 16.Which of these is true of a code editor? (a) answers page requests (b) sends pages over the net (c) hosts websites online (d) is where we type code
17. 17.📋 Which list tag shows bullet points? (a) <li> (b) <ol> (c) <ul>
18. 18.📋 What number does the browser show next to “Papaya”?
    <ol start="4">
      <li>Guava</li>
      <li>Papaya</li>
      <li>Mango</li>
      <li>Banana</li>
    </ol>
19. 19.🔐 Is iloveyou a strong or a weak password? (a) strong (b) weak
20. 20.🖼️ How many pixels wide is the picture drawn?
    <img src="kite.png" alt="A red kite" width="350">
21. 21.True or false: h1 is an element selector. (a) False (b) True
22. 22.True or false: body is an element selector. (a) True (b) False
23. 23.🖼️ Does <img> need a closing tag? (a) No (b) Yes
24. 24.True or false: “images with no alt” makes the page harder to use. (a) True (b) False
25. 25.⚖️ What colour is the text of this element?
    <p class="red" id="logo">Hi</p>
    CSS:
    .red { color: orange; }
    p { color: green; } (a) green (b) orange (c) blue (d) yellow
26. 26.📊 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>Jamun</td><td>Papaya</td><td>Jamun</td><td>Papaya</td></tr>
    </table>
27. 27.🌈 Which hex code is white? (a) #ffff00 (b) #ff0000 (c) #ffffff (d) #ff00ff
28. 28.📄 Where does the text of <title> appear? (a) nowhere (b) in a big heading (c) on the browser tab (d) at the bottom
29. 29.🔍 Which is the odd one out? (a) makes a form box (b) makes headings and lists (c) sets colours and fonts (d) gives the page structure
30. 30.🔢 In a basic web page file, which comes first: “</html>” or “<!DOCTYPE html>”? (a) <!DOCTYPE html> (b) </html>
31. 31.📱 The screen is 1100px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (max-width: 600px) {
      p {
        font-size: 10px;
      }
    }
32. 32.🔠 How many headings are in this code?
    <h1>Fun facts</h1>
    <h4>The red kite</h4>
    <p>My pets</p>
    <h2>I love mangoes.</h2>
33. 33.🖌️ How big is the text, in px?
    h1 {
      text-align: left;
      color: yellow;
      background-color: white;
      font-size: 32px;
    }
34. 34.✍️ Which property is set to 2px solid in this rule?
    .note {
      width: 300px;
      border: 2px solid;
    } (a) 2px solid (b) width (c) border (d) font-style
35. 35.📊 How many cells does this table have in all?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th><th>Day</th></tr>
      <tr><td>Grapes</td><td>Mango</td><td>Papaya</td><td>Grapes</td></tr>
    </table>
36. 36.🌈 Which colour is #ff0000? (a) red (b) black (c) yellow (d) blue
37. 37.⚡ Which JavaScript word runs code when true? (a) if (b) for (c) console.log() (d) alert()
38. 38.🌍 What is the domain name in this URL?
    http://www.example.com/index.html (a) kids.example.org (b) http (c) www.example.com (d) /index.html
39. 39.Which of these is true of <article>? (a) holds a news story (b) is the page’s key part (c) holds a side box of tips (d) holds the menu of links
40. 40.🌈 Which hex code is black? (a) #ffff00 (b) #000000 (c) #ff00ff (d) #00ff00

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