Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 436 · 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 colour is #00ff00? (a) white (b) bright green (c) black (d) cyan
2. 2.⚖️ What colour is the text of this element?
   <h1 class="note" id="hero">Hi</h1>
   CSS:
   h1 { color: green; }
   h1 { color: black; } (a) green (b) black (c) blue (d) red
3. 3.🔗 Which address opens when you click this link?
   <a href="contact.html">Contact us</a> (a) maths.html (b) https://example.com (c) contact.html (d) Contact us
4. 4.🎯 Which element does the selector .red style? (a) <h2 class="star"> (b) <h1 id="red"> (c) <h1 class="box"> (d) <h1 class="red">
5. 5.🔁 How many times does this code print “Well done”?
   for (let i = 0; i <= 3; i++) {
     console.log("Well done");
   }
6. 6.📱 The screen is 1366px wide. Does the rule inside @media apply?
   p {
     font-size: 16px;
   }
   @media (max-width: 600px) {
     p {
       font-size: 14px;
     }
   } (a) No (b) Yes
7. 7.📄 What is the first line of an HTML5 page? (a) <!DOCTYPE html> (b) <body> (c) <head> (d) <html>
8. 8.📊 How many heading cells (<th>) does this table have?
   <table>
     <tr><th>Name</th><th>Fruit</th><th>Price</th></tr>
     <tr><td>Litchi</td><td>Jamun</td><td>Guava</td></tr>
     <tr><td>Grapes</td><td>Guava</td><td>Orange</td></tr>
     <tr><td>Banana</td><td>Orange</td><td>Litchi</td></tr>
   </table>
9. 9.🖼️ Which attribute of <img> sets how wide it is? (a) alt (b) height (c) src (d) width
10. 10.💬 Does the browser show comments on the page? (a) Yes (b) No
11. 11.🔢 In a basic web page file, which comes first: “<html>” or “<!DOCTYPE html>”? (a) <!DOCTYPE html> (b) <html>
12. 12.📝 Which tag makes a drop-down list? (a) <li> (b) <ul> (c) <select> (d) <ol>
13. 13.True or false: to log out on shared PCs is not safe. (a) False (b) True
14. 14.🌈 In #de0000 the red part is the hex number de. What is it as a normal number?
15. 15.📦 In the box model, which part is space inside the border? (a) margin (b) border (c) padding (d) content
16. 16.🔢 When you open a web page, which comes first: “DNS finds the server” or “the server sends files”? (a) the server sends files (b) DNS finds the server
17. 17.💬 Why do coders write comments? (a) to show pictures (b) to make links (c) to leave notes (d) to add colour
18. 18.♿ Does this help everyone, or make the page harder to use: add alt text to images? (a) helps everyone (b) makes it harder
19. 19.🧩 Which language changes the text size? (a) CSS (b) HTML (c) JavaScript
20. 20.True or false: <img> has a closing tag. (a) True (b) False
21. 21.⚖️ What colour is the text of this element?
    <p class="note" id="logo">Hi</p>
    CSS:
    p { color: orange; }
    p { color: black; } (a) blue (b) black (c) yellow (d) orange
22. 22.🌈 Which colour is #000000? (a) black (b) bright green (c) magenta (d) red
23. 23.Which of these is not safe to do online? (a) click prize links (b) keep passwords secret (c) log out on shared PCs (d) check for https first
24. 24.🌐 Which one sends pages over the net? (a) a code editor (b) a web browser (c) a web server
25. 25.🔢 When you open a web page, which comes FIRST? (a) the browser shows it (b) you type the URL (c) the browser asks it (d) DNS finds the server
26. 26.🔗 Where does this link open?
    <a href="news.html">School news</a> (a) in the same tab (b) in a new tab
27. 27.🧭 Is <article> semantic or not semantic? (a) not semantic (b) semantic
28. 28.🌈 What is the biggest number one colour can have in rgb()? (a) 99 (b) 255 (c) 1000 (d) 100
29. 29.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 260px;
      justify-content: center;
    }
    Inside are 2 boxes, each 100px wide (no margins).
30. 30.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
    .box {
      width: 270px;
      padding: 20px;
      border: 4px solid black;
      margin: 0px;
    }
31. 31.True or false: HTML puts a picture on a page. (a) True (b) False
32. 32.✍️ In color: blue; which part is the property? (a) : (b) ; (c) blue (d) color
33. 33.True or false: “label every form box” makes the page harder to use. (a) True (b) False
34. 34.🌗 Is light grey on white easy or hard to read? (a) hard to read (b) easy to read
35. 35.🧭 Which semantic tag is the page’s key part? (a) <nav> (b) <aside> (c) <main> (d) <header>
36. 36.🌐 Which one opens web pages for us? (a) a code editor (b) a web server (c) a web browser
37. 37.📦 How much space top to bottom (px) does this box take in all, margin included?
    .box {
      height: 60px;
      padding: 10px;
      border: 3px solid black;
      margin: 10px;
    }
38. 38.📋 Does this list show bullets or numbers?
    <ul>
      <li>Litchi</li>
      <li>Jamun</li>
    </ul> (a) bullets (b) numbers
39. 39.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 7; i++) {
      total = total + i;
    }
    console.log(total);
40. 40.⚡ What number does this code print?
    let a = 59;
    let b = 32;
    console.log(a - b);

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