Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 557 · 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 file should this code go in: <h1>My Site</h1> (a) style.css (b) script.js (c) index.html
2. 2.✍️ In color: blue; which part is the value? (a) blue (b) : (c) color (d) ;
3. 3.🎯 Which element does the selector span style? (a) <h1 class="menu"> (b) <h2 id="end"> (c) <span class="menu"> (d) <p>
4. 4.🔍 Which line is missing its closing tag?
   line 1: <i>Good morning!
   line 2: <p>My best friend</p>
   line 3: <u>I love mangoes.</u> (a) line 2 (b) line 3 (c) line 1
5. 5.Which of these is true of a code editor? (a) colours code to help us (b) turns HTML into a page (c) opens web pages for us (d) shows pages from the web
6. 6.🏷️ Is </p> an opening tag or a closing tag? (a) a closing tag (b) an opening tag
7. 7.📱 max-width: 600px applies when the screen is ___. (a) turned off (b) 600px or narrower (c) exactly 1000px (d) 600px or wider
8. 8.📄 Can HTML on its own make links to pages? (a) Yes (b) No
9. 9.⚖️ Two rules with the same selector set a colour. Which one wins? (a) the first one (b) neither (c) the later one (d) the shorter one
10. 10.✍️ What value is given to background-color in this rule?
    li {
      background-color: yellow;
      font-size: 20px;
      color: red;
    } (a) background-color (b) yellow (c) 8px (d) 10px
11. 11.Which of these is not safe to do online? (a) check for https first (b) think before you post (c) post your home address (d) use a nickname in games
12. 12.🎯 Can many elements share the same class? (a) Yes (b) No
13. 13.🔗 Which tag makes a clickable link? (a) <link> (b) <img> (c) <a> (d) <p>
14. 14.True or false: <article> holds extra side notes. (a) False (b) True
15. 15.Which of these is a closing tag? (a) </b> (b) <b> (c) <li> (d) <p>
16. 16.⚡ Which JavaScript word writes in the console? (a) if (b) for (c) console.log() (d) alert()
17. 17.True or false: <input type="text"> is for one line of words. (a) True (b) False
18. 18.📛 In <a href="x.html">, what is href? (a) a comment (b) a closing tag (c) an element name (d) an attribute
19. 19.📊 Which tag makes one table row? (a) <td> (b) <tr> (c) <th> (d) <table>
20. 20.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
    .box {
      width: 170px;
      padding: 5px;
      border: 5px solid black;
      margin: 15px;
    }
21. 21.⚡ What number does this code print?
    let a = 8;
    let b = 5;
    console.log(a * b);
22. 22.🖌️ What colour are the letters?
    h1 {
      color: red;
      text-align: right;
      font-size: 28px;
      background-color: green;
    } (a) red (b) green (c) white
23. 23.📱 The screen is 700px wide. Does the rule inside @media apply?
    p {
      font-size: 12px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 10px;
      }
    } (a) Yes (b) No
24. 24.📄 Which part holds everything you see on the page? (a) the head (b) the title (c) the body (d) the doctype
25. 25.🔠 Which tag is the least important heading? (a) <h3> (b) <p> (c) <h6> (d) <h1>
26. 26.📋 How many items does this list show?
    <ul>
      <li>Jamun</li>
      <li>Guava</li>
      <li>Grapes</li>
      <li>Mango</li>
      <li>Banana</li>
      <li>Orange</li>
    </ul>
27. 27.📱 The screen is 1100px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (min-width: 768px) {
      p {
        font-size: 14px;
      }
    }
28. 28.🚀 Which file should this code go in: #top { color: blue; } (a) style.css (b) script.js (c) index.html
29. 29.🖼️ Does <img> need a closing tag? (a) No (b) Yes
30. 30.🔠 Which heading shows the SMALLEST text: <h1>, <h5>, <h3> or <h2>? (a) <h3> (b) <h1> (c) <h5> (d) <h2>
31. 31.⚡ What does this code print? (Look at the quotes!)
    let x = "8";
    let y = 8;
    console.log(x + y); (a) Error (b) 16 (c) 88
32. 32.📄 What is the big heading shown on this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>My Hobbies</title>
    </head>
    <body>
      <h1>Match report</h1>
      <p>Thanks for visiting.</p>
    </body>
    </html> (a) My Hobbies (b) Thanks for visiting. (c) Match report (d) body
33. 33.True or false: .box { padding: 8px; } goes in style.css. (a) True (b) False
34. 34.⚖️ What colour is the text of this element?
    <p class="menu" id="logo">Hi</p>
    CSS:
    .menu { color: yellow; }
    .menu { color: red; } (a) red (b) yellow (c) orange (d) blue
35. 35.📊 Which tag holds the whole table? (a) <table> (b) <caption> (c) <td> (d) <th>
36. 36.⚡ Which tag holds JavaScript in a page? (a) <js> (b) <style> (c) <code> (d) <script>
37. 37.🚀 Which file should this code go in: console.log(5 + 2); (a) script.js (b) style.css (c) index.html
38. 38.⚖️ What colour is the text of this element?
    <h2 class="box" id="logo">Hi</h2>
    CSS:
    #logo { color: purple; }
    #logo { color: green; } (a) blue (b) purple (c) yellow (d) green
39. 39.🔢 To build and share your first web page, what comes right after “write the HTML”? (a) add CSS styles (b) publish it online (c) test in a browser (d) plan what to show
40. 40.🎯 Which CSS selector matches this element?
    <span class="star" id="end">Hello</span> (a) .menu (b) #star (c) .star (d) p

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