Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 763 · 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 tag loads script.js into a page? (a) <script src="script.js"> (b) <js src="script.js"> (c) <a href="script.js"> (d) <link script.js>
2. 2.💬 Does the browser show comments on the page? (a) No (b) Yes
3. 3.📦 In the box model, which part is the line round the box? (a) margin (b) content (c) padding (d) border
4. 4.🧭 How many <main> parts should a page have? (a) none (b) one (c) ten (d) three
5. 5.✍️ What is the selector in this CSS rule?
   p {
     padding: 8px;
     color: red;
   } (a) padding (b) red (c) p (d) .note
6. 6.📄 Can HTML on its own make links to pages? (a) Yes (b) No
7. 7.True or false: <h1> has a closing tag. (a) False (b) True
8. 8.📝 At most, how many of these can be chosen at the same time?
   <form>
     <input type="radio" name="sport"> Hockey
     <input type="radio" name="sport"> Football
     <input type="radio" name="sport"> Cricket
     <input type="radio" name="sport"> Kabaddi
   </form>
9. 9.🎯 Which CSS selector matches this element?
   <li class="red" id="logo">Hello</li> (a) .logo (b) #end (c) #red (d) li
10. 10.🔢 In a basic web page file, which comes FIRST? (a) <body> (b) <!DOCTYPE html> (c) </html> (d) <html>
11. 11.📱 The screen is 540px wide. Does the rule inside @media apply?
    p {
      font-size: 12px;
    }
    @media (min-width: 480px) {
      p {
        font-size: 16px;
      }
    } (a) Yes (b) No
12. 12.⚡ What does this code print? (Look at the quotes!)
    let x = "4";
    let y = 2;
    console.log(x + y); (a) Error (b) 42 (c) 6
13. 13.🔢 On a typical page, from top to bottom, what comes right after “<header>”? (a) <main> (b) <footer> (c) <nav>
14. 14.🔍 One closing tag is missing. Which one?
    <small>Rain today</small>
    <em>I love mangoes.
    <p>Good morning!</p> (a) </p> (b) </em> (c) </i> (d) </small>
15. 15.🔁 How many times does this code print “Hi”?
    for (let i = 1; i <= 3; i++) {
      console.log("Hi");
    }
16. 16.📱 max-width: 600px applies when the screen is ___. (a) 600px or narrower (b) 600px or wider (c) exactly 1000px (d) turned off
17. 17.What does font-family do? (a) picks the font style (b) sets the letter colour (c) makes letters bigger (d) makes the text bold
18. 18.What does justify-content: flex-start do? (a) packs boxes at the end (b) packs boxes at the start (c) puts boxes in the middle (d) equal gaps, none at ends
19. 19.🔢 When you open a web page, which comes LAST? (a) the browser asks it (b) the browser shows it (c) the server sends files (d) you type the URL
20. 20.📄 Which part holds everything you see on the page? (a) the body (b) the doctype (c) the head (d) the title
21. 21.✍️ What value is given to border in this rule?
    .box {
      width: 300px;
      background-color: yellow;
      padding: 8px;
      border: 2px solid;
    } (a) 2px solid (b) border (c) italic (d) 300px
22. 22.🌐 Which one hosts websites online? (a) a web browser (b) a web server (c) a code editor
23. 23.⚡ What number does this code print?
    let a = 28;
    let b = 4;
    console.log(a + b);
24. 24.⚡ Which JavaScript word writes in the console? (a) let (b) console.log() (c) for (d) if
25. 25.📋 Which tag goes around each item of a list? (a) <ol> (b) <li> (c) <p> (d) <ul>
26. 26.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 130px;
      justify-content: flex-start;
    }
    Inside are 2 boxes, each 40px wide (no margins).
27. 27.⚡ What number does this code print?
    let coins = 5;
    coins = coins + 8;
    coins = coins - 7;
    console.log(coins);
28. 28.📝 Does <hr> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
29. 29.True or false: HTML on its own cannot pick a random number. (a) False (b) True
30. 30.🖼️ Which attribute of <img> is read by screen readers? (a) width (b) height (c) alt (d) src
31. 31.📦 In the box model, which part is the gap round content? (a) content (b) margin (c) padding (d) border
32. 32.🎨 What does CSS stand for? (a) Creative Sheet System (b) Cascading Style Sheets (c) Computer Style Sheets (d) Colourful Site Styles
33. 33.🌐 Which one sends pages over the net? (a) a web browser (b) a code editor (c) a web server
34. 34.📊 How many rows does this table have?
    <table>
      <tr><td>Orange</td><td>Jamun</td><td>Guava</td><td>Jamun</td></tr>
      <tr><td>Grapes</td><td>Mango</td><td>Mango</td><td>Jamun</td></tr>
    </table>
35. 35.🔗 Which words do you click on?
    <a href="news.html">Contact us</a> (a) Contact us (b) Visit the site (c) href (d) news.html
36. 36.True or false: margin is a solid or dotted edge. (a) False (b) True
37. 37.🔠 Which heading shows the SMALLEST text: <h2>, <h3>, <h1> or <h6>? (a) <h1> (b) <h6> (c) <h2> (d) <h3>
38. 38.🔠 How many <h1> headings should a page usually have? (a) 3 (b) 6 (c) 10 (d) 1
39. 39.🚀 What is the home page file of a website usually called? (a) home.css (b) start.js (c) index.html (d) main.png
40. 40.📋 How many items does this list show?
    <ol>
      <li>Litchi</li>
      <li>Jamun</li>
    </ol>

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