Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 884 · 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.True or false: score = score + 1; goes in index.html. (a) True (b) False
2. 2.💪 Which flexbox property lines boxes up across? (a) gap (b) flex-direction (c) display: flex (d) align-items
3. 3.🧭 Is <main> semantic or not semantic? (a) not semantic (b) semantic
4. 4.🔠 Which tag is used for the main title on a page? (a) <p> (b) <h1> (c) <br> (d) <h6>
5. 5.📝 On how many lines does the browser show this paragraph?
   <p>Kites fly high<br>Sky is blue<br>Roses are red<br>Rivers flow</p>
6. 6.📋 Does this list show bullets or numbers?
   <ul>
     <li>Orange</li>
     <li>Jamun</li>
   </ul> (a) bullets (b) numbers
7. 7.🔢 When you open a web page, what comes right after “the browser asks it”? (a) you type the URL (b) DNS finds the server (c) the browser shows it (d) the server sends files
8. 8.📋 What number does the browser show next to “Mango”?
   <ol start="2">
     <li>Guava</li>
     <li>Grapes</li>
     <li>Mango</li>
     <li>Papaya</li>
     <li>Jamun</li>
     <li>Orange</li>
   </ol>
9. 9.🔠 Which tag is the least important heading? (a) <h6> (b) <p> (c) <h3> (d) <h1>
10. 10.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
    .box {
      width: 240px;
      padding: 30px;
      border: 1px solid black;
      margin: 15px;
    }
11. 11.Which of these is padding? (a) the gap round content (b) the line round the box (c) the gap to other boxes (d) the text or picture
12. 12.📝 What does <p> make? (a) a link (b) a picture (c) a paragraph (d) a table
13. 13.True or false: <ul> is an unordered list. (a) False (b) True
14. 14.🖼️ How many pixels wide is the picture drawn?
    <img src="kite.png" alt="A red kite" width="100">
15. 15.✍️ CSS declarations go inside which brackets? (a) { } (b) < > (c) [ ] (d) ( )
16. 16.🌈 How many pairs of hex digits are in a colour like #ff8800? (a) 6 (b) 3 (c) 2 (d) 4
17. 17.🔐 Is 111111 a strong or a weak password? (a) strong (b) weak
18. 18.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 3; i++) {
      total = total + 8;
    }
    console.log(total);
19. 19.✍️ What value is given to color in this rule?
    h1 {
      text-align: center;
      color: red;
    } (a) 20px (b) color (c) center (d) red
20. 20.🧭 Why use <nav> instead of <div> for a menu? (a) it loads faster (b) it adds pictures (c) it makes text red (d) it tells its meaning
21. 21.🔍 Which is the odd one out? (a) shows pages from the web (b) has an address bar (c) turns HTML into a page (d) hosts websites online
22. 22.📊 Which tag makes one data cell? (a) <td> (b) <caption> (c) <th> (d) <table>
23. 23.🌍 What is the domain name in this URL?
    https://www.example.com/index.html (a) /index.html (b) kids.example.org (c) www.example.com (d) https
24. 24.Which of these is an opening tag? (a) <body> (b) </body> (c) </p> (d) </h1>
25. 25.True or false: <ol> shows bullet points. (a) False (b) True
26. 26.📊 Where do <td> cells go? (a) inside the <head> (b) inside a <tr> (c) inside a <li> (d) inside a <p>
27. 27.🔠 How many headings are in this code?
    <h1>Hello, world!</h1>
    <h2>The red kite</h2>
    <h3>I love mangoes.</h3>
    <h4>The red kite</h4>
28. 28.Which of these has a closing tag? (a) <p> (b) <br> (c) <meta> (d) <img>
29. 29.Which of these is not safe to do online? (a) use a strong password (b) tell a trusted adult (c) share your password (d) log out on shared PCs
30. 30.🧩 Which language changes the page live? (a) JavaScript (b) HTML (c) CSS
31. 31.⚡ Which JavaScript word makes a new variable? (a) if (b) let (c) alert() (d) console.log()
32. 32.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 420px;
      justify-content: center;
    }
    Inside are 4 boxes, each 100px wide (no margins).
33. 33.📦 How much space top to bottom (px) does this box take in all, margin included?
    .box {
      height: 40px;
      padding: 10px;
      border: 5px solid black;
      margin: 5px;
    }
34. 34.🚀 Which file should this code go in: <p>Hello!</p> (a) style.css (b) index.html (c) script.js
35. 35.What does justify-content: space-between do? (a) packs boxes at the start (b) equal gaps, none at ends (c) packs boxes at the end (d) puts boxes in the middle
36. 36.📝 How many paragraphs does this code make?
    <p>Good morning!</p>
    <p>I love mangoes.</p>
    <p>Good morning!</p>
37. 37.🔢 In a basic web page file, which comes first: “<!DOCTYPE html>” or “<head>”? (a) <!DOCTYPE html> (b) <head>
38. 38.🧭 Which semantic tag helps you move around? (a) <header> (b) <main> (c) <aside> (d) <nav>
39. 39.⚖️ What colour is the text of this element?
    <h2 class="note" id="main">Hi</h2>
    CSS:
    #main { color: yellow; }
    #main { color: green; } (a) green (b) yellow (c) blue (d) red
40. 40.True or false: to share your OTP is not safe. (a) False (b) True

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