Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 42 · 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.🔢 To build and share your first web page, which comes FIRST? (a) write the HTML (b) plan what to show (c) test in a browser (d) publish it online
2. 2.🖼️ Which picture file does the browser load?
   <img src="tiger.jpg" alt="A tiger asleep" width="200"> (a) kite.png (b) tiger.jpg (c) map.png (d) A tiger asleep
3. 3.📋 How many items does this list show?
   <ul>
     <li>Papaya</li>
     <li>Jamun</li>
   </ul>
4. 4.📦 How much space top to bottom (px) does this box take in all, margin included?
   .box {
     height: 100px;
     padding: 30px;
     border: 5px solid black;
     margin: 0px;
   }
5. 5.Which of these does CSS do? (a) makes a form box (b) adds space around boxes (c) gives the page structure (d) reacts to a button click
6. 6.💬 How many paragraphs show on the page?
   <p>The red kite</p>
   <p>Hello, world!</p>
   <!-- <p>Cricket is fun.</p> -->
7. 7.Which of these is true of a code editor? (a) hosts websites online (b) shows pages from the web (c) turns HTML into a page (d) saves our .html files
8. 8.📝 At most, how many of these can be chosen at the same time?
   <form>
     <input type="radio" name="fruit"> Guava
     <input type="radio" name="fruit"> Papaya
     <input type="radio" name="fruit"> Banana
     <input type="radio" name="fruit"> Litchi
   </form>
9. 9.True or false: #top { color: blue; } goes in style.css. (a) False (b) True
10. 10.💬 Which text will NOT show on the page?
    <!-- <p>Fun facts</p> -->
    <p>The red kite</p>
    <p>I love mangoes.</p>
    <p>Good morning!</p> (a) Good morning! (b) I love mangoes. (c) Fun facts (d) The red kite
11. 11.🔗 Which words do you click on?
    <a href="https://example.com">Contact us</a> (a) href (b) Contact us (c) https://example.com (d) Visit the site
12. 12.🔍 One closing tag is missing. Which one?
    <em>Fun facts
    <h1>Cricket is fun.</h1>
    <strong>I love mangoes.</strong> (a) </h3> (b) </em> (c) </h1> (d) </strong>
13. 13.📄 Can HTML on its own run a game loop? (a) Yes (b) No
14. 14.What is <input type="radio"> for? (a) is for an email address (b) lets you tick many (c) picks a day (d) lets you pick only one
15. 15.🌈 Which colour is #0000ff? (a) red (b) blue (c) cyan (d) magenta
16. 16.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 280px;
      justify-content: flex-start;
    }
    Inside are 4 boxes, each 60px wide (no margins).
17. 17.⚡ What number does this code print?
    let coins = 27;
    coins = coins + 14;
    coins = coins - 25;
    console.log(coins);
18. 18.🔍 One closing tag is missing. Which one?
    <h2>My pets</h2>
    <u>Rain today</u>
    <h3>Cricket is fun. (a) </h2> (b) </u> (c) </h3> (d) </strong>
19. 19.♿ Does this help everyone, or make the page harder to use: label every form box? (a) makes it harder (b) helps everyone
20. 20.⚡ What does this code print? (Look at the quotes!)
    let x = "5";
    let y = 9;
    console.log(x + y); (a) 14 (b) 59 (c) Error
21. 21.🧭 Is <article> semantic or not semantic? (a) not semantic (b) semantic
22. 22.True or false: <tr> makes a heading cell. (a) False (b) True
23. 23.🔠 How many headings are in this code?
    <h1>My pets</h1>
    <p>Fun facts</p>
    <h2>I love mangoes.</h2>
24. 24.🖼️ Which picture file does the browser load?
    <img src="kite.png" alt="A red kite" width="50"> (a) map.png (b) kite.png (c) A red kite (d) cake.jpg
25. 25.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 6; i++) {
      total = total + 2;
    }
    console.log(total);
26. 26.🌍 What is the protocol in this URL?
    http://school.example.in/index.html (a) /index.html (b) http (c) https (d) school.example.in
27. 27.📝 How many paragraphs does this code make?
    <p>I love mangoes.</p>
    <h2>Cricket is fun.</h2>
    <p>My best friend</p>
    <p>Hello, world!</p>
28. 28.📋 Does this list show bullets or numbers?
    <ol>
      <li>Papaya</li>
      <li>Orange</li>
    </ol> (a) numbers (b) bullets
29. 29.What is <input type="date"> for? (a) lets you pick only one (b) picks a day (c) is for one line of words (d) takes only numbers
30. 30.🔗 What does target="_blank" do to a link? (a) hides the link (b) opens it in a new tab (c) makes it bold (d) makes it blank
31. 31.🌍 What is the path in this URL?
    https://learn.example.com/news/today.html (a) /news/today.html (b) /games/chess.html (c) https (d) learn.example.com
32. 32.🛡️ Online: is it safe to put secrets in comments? (a) not safe (b) safe
33. 33.🚀 Should file names have spaces, like my page.html? (a) Yes (b) No
34. 34.📱 The screen is 375px wide. Does the rule inside @media apply?
    p {
      font-size: 12px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 8px;
      }
    } (a) No (b) Yes
35. 35.📝 Does <li> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
36. 36.✍️ What value is given to font-size in this rule?
    body {
      border: 2px solid;
      color: red;
      font-size: 20px;
    } (a) font-size (b) center (c) 20px (d) yellow
37. 37.True or false: in <img>, width tells which image to load. (a) False (b) True
38. 38.True or false: <caption> gives the table a title. (a) False (b) True
39. 39.⚡ Which JavaScript word makes a new variable? (a) alert() (b) let (c) console.log() (d) for
40. 40.📄 What is the big heading shown on this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>Space Facts</title>
    </head>
    <body>
      <h1>Planets</h1>
      <p>Thanks for visiting.</p>
    </body>
    </html> (a) Planets (b) Space Facts (c) Thanks for visiting. (d) body

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