Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 536 · 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.🔁 What does i++ do? (a) takes 1 from i (b) adds 1 to i (c) doubles i (d) prints i
2. 2.🔍 Which is the odd one out? (a) is where we type code (b) turns HTML into a page (c) saves our .html files (d) colours code to help us
3. 3.🖌️ Where does the text sit on its line?
   h2 {
     background-color: green;
     text-align: center;
     font-size: 32px;
     color: orange;
   } (a) on the right (b) in the middle (c) on the left
4. 4.📄 Can HTML on its own run a game loop? (a) No (b) Yes
5. 5.🖼️ The picture cannot load. Which text does the browser show instead?
   <img src="tiger.jpg" alt="A tiger asleep" width="250"> (a) tiger.jpg (b) width (c) A tiger asleep (d) A red kite
6. 6.True or false: <hr> is an empty tag. (a) True (b) False
7. 7.🌗 Is red on green easy or hard to read? (a) easy to read (b) hard to read
8. 8.Which of these goes in the head? (a) <table> (b) <p> (c) <img> (d) <title>
9. 9.🔢 In a basic web page file, which comes first: “<html>” or “<head>”? (a) <html> (b) <head>
10. 10.🔠 How many headings are in this code?
    <h1>Hello, world!</h1>
    <p>Rain today</p>
    <h2>Fun facts</h2>
    <p>Our school trip</p>
11. 11.🖼️ Why do we add alt text to an image? (a) to colour it (b) to load it faster (c) to describe the image (d) to make it bigger
12. 12.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="cake.jpg" alt="Birthday cake" width="250"> (a) A happy dog (b) Birthday cake (c) cake.jpg (d) width
13. 13.📝 What does <br> do? (a) makes a list (b) adds a picture (c) makes text bold (d) starts a new line
14. 14.🖌️ How big is the text, in px?
    h1 {
      background-color: blue;
      font-size: 12px;
      color: red;
      text-align: left;
    }
15. 15.🔠 Are headings shown in bold by default? (a) Yes (b) No
16. 16.⚖️ What colour is the text of this element?
    <h1 class="box" id="end">Hi</h1>
    CSS:
    #end { color: red; }
    #end { color: black; } (a) black (b) green (c) red (d) purple
17. 17.📝 Which input type picks a day? (a) checkbox (b) date (c) number (d) text
18. 18.🖌️ What colour is behind the letters?
    li {
      background-color: blue;
      font-size: 20px;
      color: green;
      text-align: right;
    } (a) white (b) green (c) blue
19. 19.What does text-align do? (a) colours behind the text (b) centres a heading (c) makes the text bold (d) makes letters bigger
20. 20.🌐 Which one stores a website’s files? (a) a code editor (b) a web server (c) a web browser
21. 21.🎯 Which sign starts a class selector? (a) . (b) @ (c) & (d) #
22. 22.Which of these is true of <header>? (a) holds copyright notes (b) sits at the very top (c) sits at the bottom (d) holds a news story
23. 23.🖌️ Where does the text sit on its line?
    h1 {
      background-color: white;
      text-align: right;
      color: orange;
      font-size: 36px;
    } (a) in the middle (b) on the right (c) on the left
24. 24.🎯 Which element does the selector #hero style? (a) <div class="note"> (b) <li class="hero"> (c) <li id="top"> (d) <li id="hero">
25. 25.♿ What does good colour contrast mean? (a) text stands out clearly (b) no colours at all (c) only red text (d) many bright colours
26. 26.📝 How many paragraphs does this code make?
    <p>Our school trip</p>
    <p>Rain today</p>
    <h2>Rain today</h2>
27. 27.✍️ What value is given to color in this rule?
    body {
      margin: 10px;
      color: red;
    } (a) 20px (b) red (c) color (d) center
28. 28.🌈 Which hex code is blue? (a) #0000ff (b) #00ff00 (c) #ff00ff (d) #00ffff
29. 29.🏷️ Which is the closing tag for <h3>? (a) </h3> (b) <h3> (c) <\h3> (d) <h3/>
30. 30.📊 Are <th> cells shown bold and centred by default? (a) Yes (b) No
31. 31.🔗 Which words do you click on?
    <a href="games.html">Contact us</a> (a) games.html (b) Visit the site (c) Contact us (d) href
32. 32.✍️ Which sign goes between a property and its value? (a) - (b) = (c) : (d) ;
33. 33.📄 What does the browser tab show for this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>Art Gallery</title>
    </head>
    <body>
      <h1>Match report</h1>
      <p>Try this poha.</p>
    </body>
    </html> (a) Match report (b) index.html (c) Try this poha. (d) Art Gallery
34. 34.🌈 Which colour is #00ffff? (a) magenta (b) blue (c) bright green (d) cyan
35. 35.📄 What does the browser tab show for this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>My Hobbies</title>
    </head>
    <body>
      <h1>Planets</h1>
      <p>Here is my best one.</p>
    </body>
    </html> (a) Here is my best one. (b) My Hobbies (c) Planets (d) index.html
36. 36.⚖️ What colour is the text of this element?
    <h1 class="star" id="top">Hi</h1>
    CSS:
    #top { color: red; }
    h1 { color: green; } (a) green (b) white (c) orange (d) red
37. 37.⚖️ Which selector is the strongest? (a) an id selector (b) an element selector (c) a class selector
38. 38.🔍 Which is the odd one out? (a) shows line numbers (b) is where we type code (c) saves our .html files (d) sends pages over the net
39. 39.Which of these is the border? (a) the line round the box (b) space outside the border (c) the gap round content (d) the text or picture
40. 40.🌗 Is white on black easy or hard to read? (a) hard to read (b) easy to read

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