Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 845 · 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.True or false: <img src="cat.png"> goes in index.html. (a) False (b) True
2. 2.📦 How much space across (px) does this box take in all, margin included?
   .box {
     width: 50px;
     padding: 5px;
     border: 1px solid black;
     margin: 10px;
   }
3. 3.What is <input type="password"> for? (a) picks a day (b) sends the form (c) hides what you type (d) is for one line of words
4. 4.📱 The screen is 820px wide. Does the rule inside @media apply?
   p {
     font-size: 16px;
   }
   @media (min-width: 480px) {
     p {
       font-size: 18px;
     }
   } (a) Yes (b) No
5. 5.🔠 How many <h1> headings should a page usually have? (a) 1 (b) 6 (c) 3 (d) 10
6. 6.📱 The screen is 1366px wide. What font-size (px) does the paragraph get?
   p {
     font-size: 20px;
   }
   @media (max-width: 600px) {
     p {
       font-size: 14px;
     }
   }
7. 7.🔗 Which words do you click on?
   <a href="maths.html">Visit the site</a> (a) Maths fun (b) maths.html (c) Visit the site (d) href
8. 8.🌈 In #00a300 the green part is the hex number a3. What is it as a normal number?
9. 9.🔢 In a basic web page file, which comes first: “</head>” or “</html>”? (a) </head> (b) </html>
10. 10.📋 Which list tag shows 1, 2, 3 numbers? (a) <ol> (b) <li> (c) <ul>
11. 11.🔍 Which is the odd one out? (a) hosts websites online (b) opens web pages for us (c) stores a website’s files (d) sends pages over the net
12. 12.🌈 Which hex code is yellow? (a) #ff0000 (b) #ffff00 (c) #00ff00 (d) #0000ff
13. 13.💬 Does the browser show comments on the page? (a) Yes (b) No
14. 14.🔗 Where does this link open?
    <a href="games.html">School news</a> (a) in a new tab (b) in the same tab
15. 15.🌈 How many pairs of hex digits are in a colour like #ff8800? (a) 6 (b) 4 (c) 3 (d) 2
16. 16.True or false: <link rel="stylesheet"> goes in the body. (a) True (b) False
17. 17.🔠 How many headings are in this code?
    <h1>Fun facts</h1>
    <p>My pets</p>
    <h2>Hello, world!</h2>
    <h3>Good morning!</h3>
    <h2>Cricket is fun.</h2>
18. 18.📋 How many items does this list show?
    <ul>
      <li>Jamun</li>
      <li>Orange</li>
    </ul>
19. 19.🔁 How many times does this code print “Hi”?
    for (let i = 1; i <= 10; i++) {
      console.log("Hi");
    }
20. 20.💪 Which flexbox property spaces boxes along a row? (a) gap (b) flex-direction (c) align-items (d) justify-content
21. 21.📄 What is the big heading shown on this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>Riya’s Recipes</title>
    </head>
    <body>
      <h1>Welcome!</h1>
      <p>I like to read.</p>
    </body>
    </html> (a) body (b) Welcome! (c) Riya’s Recipes (d) I like to read.
22. 22.📱 Responsive design means a page ___. (a) never changes (b) has no pictures (c) is only for laptops (d) fits every screen
23. 23.💬 Why do coders write comments? (a) to show pictures (b) to add colour (c) to leave notes (d) to make links
24. 24.📄 Where does <a> go: in the head or in the body? (a) in the body (b) in the head
25. 25.🌈 In #rrggbb, which colour do the last two digits give? (a) blue (b) red (c) white (d) green
26. 26.🚀 Which file should this code go in: alert("Hi"); (a) index.html (b) script.js (c) style.css
27. 27.📝 Does <br> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
28. 28.⚖️ What colour is the text of this element?
    <h1 class="star" id="end">Hi</h1>
    CSS:
    #end { color: blue; }
    #end { color: purple; } (a) blue (b) yellow (c) black (d) purple
29. 29.📝 How many paragraphs does this code make?
    <p>My best friend</p>
    <h2>Cricket is fun.</h2>
    <h2>My best friend</h2>
30. 30.🔁 What does this code print?
    let temp = 25;
    if (temp >= 16) {
      console.log("Hot");
    } else {
      console.log("Cool");
    } (a) Hot (b) Cool
31. 31.🌈 Which colour is rgb(0, 255, 255)? (a) white (b) magenta (c) cyan (d) yellow
32. 32.What is <input type="checkbox"> for? (a) lets you pick only one (b) is for an email address (c) picks a day (d) lets you tick many
33. 33.🛡️ A pop-up says you won a prize and asks for your password. What do you do? (a) click it twice (b) close it, tell an adult (c) type the password (d) share it with friends
34. 34.🔁 What does this code print?
    let age = 43;
    if (age > 37) {
      console.log("teen");
    } else {
      console.log("child");
    } (a) child (b) teen
35. 35.🧭 Which semantic tag holds the menu of links? (a) <aside> (b) <nav> (c) <main> (d) <header>
36. 36.Which of these is a closing tag? (a) <p> (b) </h1> (c) <h1> (d) <b>
37. 37.📋 Which tag goes around each item of a list? (a) <ol> (b) <p> (c) <li> (d) <ul>
38. 38.True or false: <h1> is an empty tag. (a) False (b) True
39. 39.🎯 What kind of selector is .note? (a) a class selector (b) an id selector (c) an element selector
40. 40.True or false: the content is the gap round content. (a) False (b) True

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