Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 445 · 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.📄 Where does the text of <title> appear? (a) nowhere (b) at the bottom (c) in a big heading (d) on the browser tab
2. 2.🔒 What does the lock (HTTPS) in the address bar mean? (a) the site is fast (b) the site is free (c) the site is a game (d) the data is scrambled
3. 3.⚡ What does this code show?
   let name = "Meera";
   console.log("Well done, " + name + "!"); (a) Well done, name! (b) Meera (c) name (d) Well done, Meera!
4. 4.🔁 What does this code print?
   let score = 47;
   if (score >= 40) {
     console.log("You win");
   } else {
     console.log("Play again");
   } (a) You win (b) Play again
5. 5.📝 How many paragraphs does this code make?
   <p>My pets</p>
   <h2>Rain today</h2>
   <h2>Our school trip</h2>
   <p>Our school trip</p>
   <h2>Good morning!</h2>
   <p>The red kite</p>
6. 6.🖼️ How many pixels wide is the picture drawn?
   <img src="fort.jpg" alt="An old fort" width="400">
7. 7.🔍 One closing tag is missing. Which one?
   <em>Good morning!
   <p>Cricket is fun.</p>
   <h2>Our school trip</h2> (a) </h2> (b) </em> (c) </p> (d) </i>
8. 8.🌍 Which one shows the page to you? (a) HTTPS (b) the server (c) the browser (d) the URL
9. 9.💪 Which flexbox property picks row or column? (a) justify-content (b) gap (c) flex-direction (d) align-items
10. 10.🎯 Which element does the selector p style? (a) <h2 class="box"> (b) <h1> (c) <li id="logo"> (d) <p class="box">
11. 11.📄 What does the browser tab show for this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>Cricket Club</title>
    </head>
    <body>
      <h1>Welcome!</h1>
      <p>Mars is red.</p>
    </body>
    </html> (a) index.html (b) Welcome! (c) Cricket Club (d) Mars is red.
12. 12.🔗 Where does this link open?
    <a href="games.html">Play games</a> (a) in a new tab (b) in the same tab
13. 13.Which of these is true of <aside>? (a) holds the main content (b) holds copyright notes (c) holds a side box of tips (d) holds one blog post
14. 14.🔗 Where does this link open?
    <a href="art.html" target="_blank">School news</a> (a) in a new tab (b) in the same tab
15. 15.💪 Which justify-content value packs boxes at the end? (a) flex-start (b) flex-end (c) center (d) space-between
16. 16.🏷️ Every HTML tag starts with which sign? (a) < (b) ( (c) { (d) [
17. 17.🚀 Which tag loads script.js into a page? (a) <link script.js> (b) <a href="script.js"> (c) <script src="script.js"> (d) <js src="script.js">
18. 18.🔁 What does i++ do? (a) adds 1 to i (b) prints i (c) doubles i (d) takes 1 from i
19. 19.📝 How many paragraphs does this code make?
    <p>Rain today</p>
    <p>Cricket is fun.</p>
    <h2>Hello, world!</h2>
    <p>Our school trip</p>
20. 20.💬 How does an HTML comment end? (a) --> (b) */ (c) >> (d) //
21. 21.📝 Which input type picks a day? (a) number (b) radio (c) submit (d) date
22. 22.📱 The screen is 700px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 16px;
    }
    @media (min-width: 480px) {
      p {
        font-size: 24px;
      }
    }
23. 23.🌈 Which colour is #ffffff? (a) yellow (b) magenta (c) black (d) white
24. 24.💬 Can anyone read your comments by viewing the page source? (a) Yes (b) No
25. 25.🎯 What kind of selector is p? (a) a class selector (b) an id selector (c) an element selector
26. 26.📄 What is the first line of an HTML5 page? (a) <head> (b) <body> (c) <!DOCTYPE html> (d) <html>
27. 27.♿ Is this heading order correct (no level skipped)?
    <h1> → <h1> → <h3> → <h3> (a) No (b) Yes
28. 28.⚖️ What colour is the text of this element?
    <h2 class="box" id="hero">Hi</h2>
    CSS:
    #hero { color: purple; }
    h2 { color: blue; } (a) yellow (b) blue (c) green (d) purple
29. 29.🔢 On a typical page, from top to bottom, which comes FIRST? (a) <main> (b) <nav> (c) <footer> (d) <header>
30. 30.🧭 Which semantic tag holds the logo and title? (a) <nav> (b) <article> (c) <header> (d) <main>
31. 31.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="map.png" alt="Map of India" width="400"> (a) map.png (b) Map of India (c) width (d) Birthday cake
32. 32.🔠 Which heading shows the BIGGEST text: <h1>, <h5>, <h6> or <h4>? (a) <h4> (b) <h6> (c) <h1> (d) <h5>
33. 33.🔠 Which heading shows the SMALLEST text: <h1>, <h3>, <h6> or <h2>? (a) <h2> (b) <h3> (c) <h6> (d) <h1>
34. 34.🔗 Where does this link open?
    <a href="quiz.html" target="_blank">School news</a> (a) in a new tab (b) in the same tab
35. 35.🌈 Which colour is #000000? (a) red (b) cyan (c) black (d) white
36. 36.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 60px;
      padding: 5px;
      border: 2px solid black;
      margin: 5px;
    }
37. 37.🎯 What kind of selector is body? (a) a class selector (b) an id selector (c) an element selector
38. 38.✍️ What value is given to color in this rule?
    p {
      font-size: 20px;
      margin: 10px;
      text-align: center;
      color: red;
    } (a) 20px (b) center (c) color (d) red
39. 39.🌈 Which hex code is blue? (a) #0000ff (b) #000000 (c) #00ffff (d) #00ff00
40. 40.⚡ What does JavaScript add to a web page? (a) the page title (b) the domain name (c) only colours (d) actions and changes

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