Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 534 · 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 this code print?
   let marks = 44;
   if (marks < 40) {
     console.log("Pass");
   } else {
     console.log("Try again");
   } (a) Try again (b) Pass
2. 2.🖼️ The picture cannot load. Which text does the browser show instead?
   <img src="dog.jpg" alt="A happy dog" width="250"> (a) width (b) dog.jpg (c) The full moon (d) A happy dog
3. 3.True or false: <link rel="stylesheet"> goes in the head. (a) False (b) True
4. 4.🔠 How many headings are in this code?
   <h1>The red kite</h1>
   <p>My best friend</p>
   <p>Good morning!</p>
   <h3>Rain today</h3>
   <h2>Cricket is fun.</h2>
5. 5.Which of these is a closing tag? (a) <body> (b) <p> (c) </p> (d) <h1>
6. 6.True or false: to meet an online stranger is not safe. (a) True (b) False
7. 7.🖼️ Which attribute of <img> names the picture file? (a) alt (b) src (c) width (d) height
8. 8.⚡ What number does this code print?
   let a = 5;
   let b = 9;
   console.log(a * b);
9. 9.📊 How many cells does this table have in all?
   <table>
     <tr><td>Jamun</td><td>Jamun</td><td>Mango</td></tr>
     <tr><td>Guava</td><td>Banana</td><td>Orange</td></tr>
   </table>
10. 10.🔁 When does the else part run? (a) never (b) when if is false (c) always (d) when if is true
11. 11.📄 What does the browser tab show for this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>Art Gallery</title>
    </head>
    <body>
      <h1>Planets</h1>
      <p>Try this poha.</p>
    </body>
    </html> (a) Art Gallery (b) Planets (c) index.html (d) Try this poha.
12. 12.🧩 Which language lays out the page? (a) HTML (b) CSS (c) JavaScript
13. 13.💬 How many paragraphs show on the page?
    <p>I love mangoes.</p>
    <p>The red kite</p>
    <p>Cricket is fun.</p>
    <!-- <p>Good morning!</p> -->
14. 14.🔢 To build and share your first web page, what comes right after “test in a browser”? (a) write the HTML (b) plan what to show (c) add CSS styles (d) publish it online
15. 15.🌈 Which colour is #00ff00? (a) yellow (b) bright green (c) black (d) red
16. 16.True or false: the border is a solid or dotted edge. (a) False (b) True
17. 17.True or false: <ul> lists steps in order. (a) True (b) False
18. 18.🛡️ Online: is it safe to check for https first? (a) safe (b) not safe
19. 19.⚖️ What colour is the text of this element?
    <p class="menu" id="hero">Hi</p>
    CSS:
    .menu { color: green; }
    .menu { color: yellow; } (a) purple (b) yellow (c) white (d) green
20. 20.📊 Which tag makes one data cell? (a) <tr> (b) <td> (c) <table> (d) <caption>
21. 21.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
    .box {
      width: 100px;
      padding: 5px;
      border: 3px solid black;
      margin: 10px;
    }
22. 22.🔁 What does i++ do? (a) takes 1 from i (b) doubles i (c) prints i (d) adds 1 to i
23. 23.🔠 Which heading shows the SMALLEST text: <h6>, <h2>, <h5> or <h3>? (a) <h5> (b) <h2> (c) <h3> (d) <h6>
24. 24.⚖️ What colour is the text of this element?
    <p class="menu" id="intro">Hi</p>
    CSS:
    #intro { color: black; }
    #intro { color: purple; } (a) black (b) purple (c) yellow (d) red
25. 25.⚖️ What colour is the text of this element?
    <p class="menu" id="logo">Hi</p>
    CSS:
    #logo { color: yellow; }
    #logo { color: white; } (a) green (b) yellow (c) purple (d) white
26. 26.⚡ A JavaScript file usually ends with which extension? (a) .html (b) .js (c) .jpg (d) .css
27. 27.✍️ What is the selector in this CSS rule?
    .note {
      background-color: yellow;
      margin: 10px;
    } (a) .note (b) 10px (c) #top (d) background-color
28. 28.📱 Which tag helps phones show a page at the right size? (a) the title tag (b) the br tag (c) the hr tag (d) the viewport meta tag
29. 29.True or false: “write clear link text” helps everyone use the page. (a) True (b) False
30. 30.⚡ What number does this code print?
    let a = 32;
    let b = 27;
    console.log(a + b);
31. 31.✍️ How many declarations (property: value pairs) are in this rule?
    #top {
      font-size: 20px;
      margin: 10px;
      background-color: yellow;
      font-weight: bold;
    }
32. 32.✍️ What is the selector in this CSS rule?
    h1 {
      font-style: italic;
      text-align: center;
    } (a) center (b) h1 (c) font-style (d) p
33. 33.True or false: a web server sends pages over the net. (a) False (b) True
34. 34.💬 How does an HTML comment end? (a) >> (b) --> (c) // (d) */
35. 35.🚀 Which tag loads script.js into a page? (a) <js src="script.js"> (b) <link script.js> (c) <a href="script.js"> (d) <script src="script.js">
36. 36.🎯 Which element does the selector .menu style? (a) <span class="note"> (b) <span id="menu"> (c) <span class="menu"> (d) <p class="big">
37. 37.What is <input type="text"> for? (a) hides what you type (b) lets you pick only one (c) takes only numbers (d) is for one line of words
38. 38.📄 What is the big heading shown on this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>My Hobbies</title>
    </head>
    <body>
      <h1>All about me</h1>
      <p>Here is my best one.</p>
    </body>
    </html> (a) All about me (b) My Hobbies (c) Here is my best one. (d) body
39. 39.🔗 Which words do you click on?
    <a href="games.html">School news</a> (a) games.html (b) Take the quiz (c) School news (d) href
40. 40.True or false: CSS rounds box corners. (a) False (b) True

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