Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 658 · 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.🔗 Where does this link open?
   <a href="quiz.html" target="_blank">Contact us</a> (a) in a new tab (b) in the same tab
2. 2.🔍 Which line is missing its closing tag?
   line 1: <h1>I love mangoes.
   line 2: <b>Our school trip</b>
   line 3: <em>Good morning!</em> (a) line 1 (b) line 2 (c) line 3
3. 3.📱 Responsive design means a page ___. (a) never changes (b) is only for laptops (c) fits every screen (d) has no pictures
4. 4.True or false: HTML changes the page live. (a) False (b) True
5. 5.🎯 Which element does the selector li style? (a) <span class="menu"> (b) <li class="menu"> (c) <p id="intro"> (d) <div>
6. 6.🌍 Which one stores the site’s files? (a) the URL (b) HTTPS (c) the browser (d) the server
7. 7.📄 Where does the text of <title> appear? (a) nowhere (b) at the bottom (c) on the browser tab (d) in a big heading
8. 8.🏷️ Which is the closing tag for <h2>? (a) <h2> (b) </h2> (c) <\h2> (d) <h2/>
9. 9.🔍 Which is the odd one out? (a) sends pages over the net (b) hosts websites online (c) stores a website’s files (d) saves our .html files
10. 10.🏷️ Is <p> an opening tag or a closing tag? (a) a closing tag (b) an opening tag
11. 11.🌈 Which hex code is cyan? (a) #00ffff (b) #000000 (c) #ff0000 (d) #ff00ff
12. 12.💪 Which flexbox property sets space between boxes? (a) align-items (b) flex-direction (c) gap (d) display: flex
13. 13.🔠 How many headings are in this code?
    <h1>Fun facts</h1>
    <p>Cricket is fun.</p>
    <h4>Fun facts</h4>
    <h2>My best friend</h2>
    <p>I love mangoes.</p>
14. 14.🖌️ Where does the text sit on its line?
    h1 {
      background-color: purple;
      color: red;
      font-size: 28px;
      text-align: center;
    } (a) on the right (b) in the middle (c) on the left
15. 15.📄 Where does <link rel="stylesheet"> go: in the head or in the body? (a) in the body (b) in the head
16. 16.Which of these is true of <article>? (a) holds one blog post (b) holds the main content (c) sits at the bottom (d) holds the menu of links
17. 17.🔠 Which tag is used for the main title on a page? (a) <h6> (b) <p> (c) <br> (d) <h1>
18. 18.Which of these is true of a web server? (a) is where we type code (b) turns HTML into a page (c) answers page requests (d) saves our .html files
19. 19.🔢 To build and share your first web page, what comes right after “plan what to show”? (a) write the HTML (b) test in a browser (c) publish it online (d) add CSS styles
20. 20.📝 How many paragraphs does this code make?
    <p>Hello, world!</p>
    <p>The red kite</p>
    <p>Cricket is fun.</p>
    <h2>Fun facts</h2>
    <p>My pets</p>
    <h2>I love mangoes.</h2>
21. 21.🌈 Which colour of light is strongest in rgb(25, 13, 172)? (a) blue (b) green (c) red
22. 22.📱 The screen is 320px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 24px;
    }
    @media (min-width: 600px) {
      p {
        font-size: 26px;
      }
    }
23. 23.⚖️ What colour is the text of this element?
    <p class="big" id="end">Hi</p>
    CSS:
    .big { color: green; }
    #end { color: white; }
    p { color: orange; } (a) green (b) orange (c) yellow (d) white
24. 24.📋 Does this list show bullets or numbers?
    <ol>
      <li>Mango</li>
      <li>Guava</li>
      <li>Banana</li>
    </ol> (a) bullets (b) numbers
25. 25.Which of these is true of <aside>? (a) helps you move around (b) is the page’s key part (c) holds the menu of links (d) holds extra side notes
26. 26.True or false: <aside> holds extra side notes. (a) False (b) True
27. 27.Which of these does CSS do? (a) rounds box corners (b) checks a quiz answer (c) counts down a timer (d) shows a pop-up message
28. 28.🌐 Which one sends pages over the net? (a) a web browser (b) a code editor (c) a web server
29. 29.🧭 Why use <nav> instead of <div> for a menu? (a) it adds pictures (b) it tells its meaning (c) it makes text red (d) it loads faster
30. 30.✍️ How does a CSS comment start? (a) <!-- (b) // (c) # (d) /*
31. 31.Which colour pair is easy to read? (a) light grey on white (b) yellow on black (c) red on green (d) yellow on white
32. 32.⚖️ Which selector is the weakest? (a) a class selector (b) an id selector (c) an element selector
33. 33.📋 Which list tag goes inside ul or ol? (a) <ul> (b) <li> (c) <ol>
34. 34.🔍 Which line is missing its closing tag?
    line 1: <h1>Rain today
    line 2: <i>Hello, world!</i>
    line 3: <h3>Fun facts</h3> (a) line 2 (b) line 3 (c) line 1
35. 35.🌍 Which one asks for a web page? (a) HTTPS (b) the URL (c) the server (d) the browser
36. 36.🌈 How many pairs of hex digits are in a colour like #ff8800? (a) 3 (b) 4 (c) 2 (d) 6
37. 37.🏷️ What does a closing tag have that an opening tag does not? (a) a hash # (b) a slash / (c) a dot . (d) a dollar $
38. 38.💬 How many paragraphs show on the page?
    <!-- <p>Good morning!</p> -->
    <!-- <p>Cricket is fun.</p> -->
    <!-- <p>My best friend</p> -->
    <p>The red kite</p>
    <p>Fun facts</p>
39. 39.True or false: to think before you post is not safe. (a) True (b) False
40. 40.⚡ What does this code print? (Look at the quotes!)
    let x = "2";
    let y = 5;
    console.log(x + y); (a) 25 (b) 7 (c) Error

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