Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 859 · 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 one shows pages from the web? (a) a code editor (b) a web server (c) a web browser
2. 2.🔗 Where does this link open?
   <a href="https://example.com" target="_blank">Art corner</a> (a) in the same tab (b) in a new tab
3. 3.🔠 How many headings are in this code?
   <h1>My pets</h1>
   <p>My best friend</p>
   <p>My best friend</p>
   <p>My best friend</p>
   <p>I love mangoes.</p>
4. 4.🔗 Which code links to about.html? (a) <a href="about.html"> (b) <a src="about.html"> (c) <link about.html> (d) <a alt="about.html">
5. 5.⚡ Which word makes a new variable? (a) let (b) make (c) give (d) put
6. 6.🔗 Which address opens when you click this link?
   <a href="about.html">Play games</a> (a) https://example.com (b) Play games (c) contact.html (d) about.html
7. 7.🔗 Which address opens when you click this link?
   <a href="news.html">Maths fun</a> (a) Maths fun (b) games.html (c) quiz.html (d) news.html
8. 8.🖼️ The picture cannot load. Which text does the browser show instead?
   <img src="fort.jpg" alt="An old fort" width="200"> (a) width (b) A tiger asleep (c) An old fort (d) fort.jpg
9. 9.Which of these is an opening tag? (a) </p> (b) </body> (c) </title> (d) <h1>
10. 10.🔢 When you open a web page, which comes FIRST? (a) you type the URL (b) the browser asks it (c) the server sends files (d) DNS finds the server
11. 11.📋 Which list shows the steps of a recipe best? (a) <ul> (b) <br> (c) <ol> (d) <hr>
12. 12.💬 Which text will NOT show on the page?
    <!-- <p>Hello, world!</p> -->
    <p>I love mangoes.</p>
    <p>Good morning!</p> (a) Hello, world! (b) I love mangoes. (c) Good morning!
13. 13.✍️ What value is given to font-style in this rule?
    h2 {
      font-style: italic;
      width: 300px;
    } (a) red (b) 20px (c) font-style (d) italic
14. 14.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 450px;
      justify-content: flex-start;
    }
    Inside are 4 boxes, each 100px wide (no margins).
15. 15.⚡ Which JavaScript word runs code when true? (a) alert() (b) console.log() (c) for (d) if
16. 16.📱 The screen is 700px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 20px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 16px;
      }
    }
17. 17.🔍 Which is the odd one out? (a) checks a quiz answer (b) makes headings and lists (c) shows a pop-up message (d) reacts to a button click
18. 18.📋 How many items does this list show?
    <ul>
      <li>Mango</li>
      <li>Banana</li>
      <li>Orange</li>
      <li>Litchi</li>
      <li>Jamun</li>
      <li>Grapes</li>
    </ul>
19. 19.🚀 Which file should this code go in: <img src="cat.png"> (a) index.html (b) style.css (c) script.js
20. 20.🔁 What does this code print?
    let score = 6;
    if (score >= 41) {
      console.log("You win");
    } else {
      console.log("Play again");
    } (a) You win (b) Play again
21. 21.🔗 Which words do you click on?
    <a href="about.html">Contact us</a> (a) href (b) about.html (c) Visit the site (d) Contact us
22. 22.🔍 Which is the odd one out? (a) makes a link (b) makes headings and lists (c) puts a picture on a page (d) rounds box corners
23. 23.✍️ Which sign goes between a property and its value? (a) = (b) - (c) : (d) ;
24. 24.✍️ What value is given to border in this rule?
    h2 {
      border: 2px solid;
      text-align: center;
      font-size: 20px;
    } (a) italic (b) 2px solid (c) border (d) 300px
25. 25.Which of these is the content? (a) the gap to other boxes (b) space outside the border (c) space inside the border (d) the text or picture
26. 26.🌈 Which colour is #00ff00? (a) blue (b) magenta (c) yellow (d) bright green
27. 27.🖼️ Which tag puts a picture on a page? (a) <p> (b) <pic> (c) <img> (d) <a>
28. 28.🖼️ Which attribute of <img> shows if the image fails? (a) src (b) height (c) width (d) alt
29. 29.🔠 Are headings shown in bold by default? (a) No (b) Yes
30. 30.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 250px;
      justify-content: center;
    }
    Inside are 3 boxes, each 50px wide (no margins).
31. 31.🔢 In a basic web page file, which comes LAST? (a) <body> (b) <!DOCTYPE html> (c) </html> (d) <html>
32. 32.🔢 On a typical page, from top to bottom, what comes right after “<header>”? (a) <main> (b) <nav> (c) <footer>
33. 33.♿ Is this heading order correct (no level skipped)?
    <h1> → <h2> → <h3> → <h4> (a) Yes (b) No
34. 34.🔗 Which words do you click on?
    <a href="contact.html">Contact us</a> (a) contact.html (b) Contact us (c) href (d) Visit the site
35. 35.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 220px;
      justify-content: center;
    }
    Inside are 2 boxes, each 100px wide (no margins).
36. 36.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="tiger.jpg" alt="A tiger asleep" width="250"> (a) A tiger asleep (b) width (c) A red kite (d) tiger.jpg
37. 37.🎨 Which tag holds CSS inside the head? (a) <body> (b) <style> (c) <css> (d) <script>
38. 38.🔢 To build and share your first web page, which comes first: “test in a browser” or “plan what to show”? (a) test in a browser (b) plan what to show
39. 39.🌈 Which colour is rgb(255, 0, 255)? (a) bright green (b) red (c) black (d) magenta
40. 40.🌈 In #007500 the green part is the hex number 75. What is it as a normal number?

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