← Web development final test lesson New set →

Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 96 · 40 questions
TalentJR

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.

NameDateTime takenScore ___ / 40
  1. 1.♿ A part of the page is under a <h1> heading. Which tag should its sub-heading use? (a) <h2> (b) <h6> (c) <h1> (d) <h4>
  2. 2.🔍 Which line is missing its closing tag?
    line 1: <small>Fun facts
    line 2: <i>I love mangoes.</i>
    line 3: <em>Our school trip</em>     (a) line 1 (b) line 2 (c) line 3
  3. 3.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 120px;
      padding: 10px;
      border: 2px solid black;
      margin: 20px;
    }
  4. 4.🔗 Which tag makes a clickable link? (a) <img> (b) <p> (c) <link> (d) <a>
  5. 5.🔁 How many times does this code print “Hello”?
    for (let i = 0; i < 8; i++) {
      console.log("Hello");
    }
  6. 6.True or false: .menu is a class selector. (a) False (b) True
  7. 7.🌍 What is the domain name in this URL?
    https://learn.example.com/maths/tables.html     (a) https (b) /maths/tables.html (c) www.example.com (d) learn.example.com
  8. 8.📋 Does this list show bullets or numbers?
    <ul>
      <li>Litchi</li>
      <li>Mango</li>
      <li>Jamun</li>
    </ul>     (a) bullets (b) numbers
  9. 9.📱 The screen is 540px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 20px;
    }
    @media (min-width: 1024px) {
      p {
        font-size: 22px;
      }
    }
  10. 10.📝 How many paragraphs does this code make?
    <p>Hello, world!</p>
    <p>I love mangoes.</p>
    <p>My pets</p>
    <p>The red kite</p>
  11. 11.⚡ What does JavaScript add to a web page? (a) the page title (b) the domain name (c) actions and changes (d) only colours
  12. 12.True or false: li is an element selector. (a) False (b) True
  13. 13.🔗 Where does this link open?
    <a href="news.html" target="_blank">Art corner</a>     (a) in the same tab (b) in a new tab
  14. 14.🔐 Is Mango#Kite29! a strong or a weak password? (a) weak (b) strong
  15. 15.🔢 In a basic web page file, which comes first: “<html>” or “<body>”? (a) <body> (b) <html>
  16. 16.🖼️ Why do we add alt text to an image? (a) to make it bigger (b) to load it faster (c) to colour it (d) to describe the image
  17. 17.🧩 Which language changes the page live? (a) JavaScript (b) HTML (c) CSS
  18. 18.🔁 When does the else part run? (a) when if is false (b) always (c) never (d) when if is true
  19. 19.📋 Which list tag is an ordered list? (a) <ul> (b) <ol> (c) <li>
  20. 20.🔁 What does this code print?
    let score = 3;
    if (score > 42) {
      console.log("You win");
    } else {
      console.log("Play again");
    }     (a) You win (b) Play again
  21. 21.📝 On how many lines does the browser show this paragraph?
    <p>Roses are red<br>Birds sing<br>Kites fly high</p>
  22. 22.📊 Which tag gives the table a title? (a) <caption> (b) <tr> (c) <table> (d) <th>
  23. 23.🔠 Which heading shows the SMALLEST text: <h2>, <h4>, <h5> or <h3>? (a) <h3> (b) <h5> (c) <h4> (d) <h2>
  24. 24.What does font-size do? (a) centres a heading (b) makes the text bold (c) sets the letter colour (d) makes letters bigger
  25. 25.True or false: the browser is the page’s address. (a) False (b) True
  26. 26.Which colour pair is easy to read? (a) light grey on white (b) black on white (c) yellow on white (d) blue on purple
  27. 27.✍️ Which sign ends each CSS declaration? (a) : (b) , (c) . (d) ;
  28. 28.🔒 Is the connection to this address scrambled (encrypted)?
    http://www.example.net/news/today.html     (a) No (b) Yes
  29. 29.🧭 Is <section> semantic or not semantic? (a) not semantic (b) semantic
  30. 30.💬 Which text will NOT show on the page?
    <!-- <p>The red kite</p> -->
    <p>My pets</p>
    <p>My best friend</p>
    <p>Fun facts</p>     (a) Fun facts (b) The red kite (c) My pets (d) My best friend
  31. 31.True or false: “tiny grey text” helps everyone use the page. (a) False (b) True
  32. 32.🌈 Which colour is rgb(0, 255, 255)? (a) blue (b) magenta (c) black (d) cyan
  33. 33.🔍 Which is the odd one out? (a) shows line numbers (b) sends pages over the net (c) stores a website’s files (d) hosts websites online
  34. 34.📝 How many <input> tags are in this form?
    <form>
      <input type="date">
      <input type="email">
      <input type="submit" value="Send">
    </form>
  35. 35.📝 You type 5 spaces between two words in a <p>. How does the browser show them? (a) as a dot (b) as 5 spaces (c) as one space (d) as a new line
  36. 36.💪 Which justify-content value puts boxes in the middle? (a) flex-start (b) flex-end (c) space-between (d) center
  37. 37.⚡ What does alert() show? (a) a table (b) a new tab (c) a pop-up box (d) a picture
  38. 38.⚡ Which word makes a new variable? (a) give (b) let (c) make (d) put
  39. 39.Which of these is true of a web server? (a) sends pages over the net (b) opens web pages for us (c) has an address bar (d) colours code to help us
  40. 40.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 340px;
      justify-content: center;
    }
    Inside are 4 boxes, each 60px wide (no margins).

Answer key

  1. <h2>
  2. line 1
  3. 184
  4. <a>
  5. 8
  6. True
  7. learn.example.com
  8. bullets
  9. 20
  10. 4
  11. actions and changes
  12. True
  13. in a new tab
  14. strong
  15. <html>
  16. to describe the image
  17. JavaScript
  18. when if is false
  19. <ol>
  20. Play again
  21. 3
  22. <caption>
  23. <h5>
  24. makes letters bigger
  25. False
  26. black on white
  27. ;
  28. No
  29. semantic
  30. The red kite
  31. False
  32. cyan
  33. shows line numbers
  34. 3
  35. as one space
  36. center
  37. a pop-up box
  38. let
  39. sends pages over the net
  40. 50

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