Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 652 · 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.📱 The screen is 700px wide. Does the rule inside @media apply?
   p {
     font-size: 12px;
   }
   @media (max-width: 1024px) {
     p {
       font-size: 6px;
     }
   } (a) No (b) Yes
2. 2.🌈 Which hex code is red? (a) #000000 (b) #ff00ff (c) #ff0000 (d) #00ffff
3. 3.🔢 On a typical page, from top to bottom, which comes FIRST? (a) <footer> (b) <nav> (c) <header> (d) <main>
4. 4.Which of these is true of <aside>? (a) is the page’s key part (b) holds the logo and title (c) helps you move around (d) holds extra side notes
5. 5.✍️ How does a CSS comment start? (a) <!-- (b) # (c) /* (d) //
6. 6.🔠 Which heading shows the SMALLEST text: <h6>, <h1>, <h5> or <h3>? (a) <h3> (b) <h1> (c) <h5> (d) <h6>
7. 7.📝 At most, how many of these can be chosen at the same time?
   <form>
     <input type="radio" name="fruit"> Papaya
     <input type="radio" name="fruit"> Litchi
     <input type="radio" name="fruit"> Banana
     <input type="radio" name="fruit"> Guava
     <input type="radio" name="fruit"> Mango
   </form>
8. 8.🚀 Which file should this code go in: <ul><li>Art</li></ul> (a) index.html (b) script.js (c) style.css
9. 9.📦 How much space across (px) does this box take in all, margin included?
   .box {
     width: 80px;
     padding: 15px;
     border: 5px solid black;
     margin: 10px;
   }
10. 10.📝 Which tag makes a drop-down list? (a) <select> (b) <ol> (c) <li> (d) <ul>
11. 11.🔍 Which is the odd one out? (a) rounds box corners (b) adds space around boxes (c) lays out the page (d) makes a link
12. 12.💪 Which justify-content value packs boxes at the start? (a) center (b) space-between (c) flex-start (d) flex-end
13. 13.🔒 What does the lock (HTTPS) in the address bar mean? (a) the site is a game (b) the site is free (c) the site is fast (d) the data is scrambled
14. 14.True or false: “images with no alt” helps everyone use the page. (a) False (b) True
15. 15.🛡️ A pop-up says you won a prize and asks for your password. What do you do? (a) close it, tell an adult (b) type the password (c) share it with friends (d) click it twice
16. 16.⚡ What does this code show?
    let name = "Arjun";
    console.log("Well done, " + name + "!"); (a) Arjun (b) name (c) Well done, name! (d) Well done, Arjun!
17. 17.🔠 How many headings are in this code?
    <h1>I love mangoes.</h1>
    <h2>Hello, world!</h2>
    <p>Fun facts</p>
    <p>Fun facts</p>
18. 18.♿ Who uses a screen reader? (a) only robots (b) only teachers (c) only coders (d) people who are blind
19. 19.⚖️ Which selector is the strongest? (a) a class selector (b) an element selector (c) an id selector
20. 20.♿ Is this heading order correct (no level skipped)?
    <h1> → <h2> → <h2> → <h3> (a) No (b) Yes
21. 21.🌍 What is the domain name in this URL?
    https://www.example.net/index.html (a) www.example.net (b) learn.example.com (c) /index.html (d) https
22. 22.Which colour pair is easy to read? (a) yellow on black (b) yellow on white (c) pink on red (d) light grey on white
23. 23.🔠 Which tag is used for the main title on a page? (a) <br> (b) <h1> (c) <p> (d) <h6>
24. 24.🔗 Which address opens when you click this link?
    <a href="quiz.html">About us</a> (a) About us (b) about.html (c) games.html (d) quiz.html
25. 25.🔤 In “HTML”, what do the letters HT stand for? (a) High Tech (b) Hot Tags (c) HyperText (d) Home Text
26. 26.✍️ How many declarations (property: value pairs) are in this rule?
    p {
      margin: 10px;
    }
27. 27.💪 How wide (px) is each gap between two boxes?
    .row {
      display: flex;
      width: 230px;
      justify-content: space-between;
    }
    Inside are 2 boxes, each 80px wide (no margins).
28. 28.🔍 Which is the odd one out? (a) has an address bar (b) sends pages over the net (c) shows pages from the web (d) opens web pages for us
29. 29.📝 Which tag makes a big box for many lines of text? (a) <input> (b) <textarea> (c) <br> (d) <p>
30. 30.🔠 Which heading shows the BIGGEST text: <h4>, <h5>, <h1> or <h2>? (a) <h5> (b) <h1> (c) <h2> (d) <h4>
31. 31.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 430px;
      justify-content: flex-start;
    }
    Inside are 4 boxes, each 100px wide (no margins).
32. 32.⚡ What number does this code print?
    let apples = 29;
    apples = apples + 10;
    apples = apples - 8;
    console.log(apples);
33. 33.🎯 What kind of selector is .star? (a) a class selector (b) an element selector (c) an id selector
34. 34.📝 Which tag holds a whole form? (a) <input> (b) <form> (c) <table> (d) <ol>
35. 35.🖌️ Which CSS property picks the font style? (a) font-size (b) text-align (c) background-color (d) font-family
36. 36.🔁 What is the LAST number this code prints?
    for (let i = 0; i < 16; i = i + 2) {
      console.log(i);
    }
37. 37.Which of these is margin? (a) a solid or dotted edge (b) space inside the border (c) the line round the box (d) the gap to other boxes
38. 38.🚀 What is the home page file of a website usually called? (a) home.css (b) start.js (c) main.png (d) index.html
39. 39.🌐 Which one shows pages from the web? (a) a code editor (b) a web browser (c) a web server
40. 40.🔢 To build and share your first web page, which comes LAST? (a) publish it online (b) write the HTML (c) test in a browser (d) plan what to show

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