Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 196 · 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 do <td> cells go? (a) inside the <head> (b) inside a <li> (c) inside a <tr> (d) inside a <p>
2. 2.📱 Responsive design means a page ___. (a) never changes (b) has no pictures (c) is only for laptops (d) fits every screen
3. 3.✍️ In color: blue; which part is the property? (a) blue (b) color (c) ; (d) :
4. 4.📦 How much space top to bottom (px) does this box take in all, margin included?
   .box {
     height: 130px;
     padding: 25px;
     border: 4px solid black;
     margin: 15px;
   }
5. 5.🛡️ Before typing a password on a site, check the address starts with ___. (a) https (b) www (c) http (d) ftp
6. 6.What is <input type="password"> for? (a) lets you tick many (b) hides what you type (c) lets you pick only one (d) is for an email address
7. 7.📝 How many paragraphs does this code make?
   <p>Good morning!</p>
   <p>Hello, world!</p>
   <p>Fun facts</p>
   <p>I love mangoes.</p>
   <p>The red kite</p>
8. 8.True or false: JavaScript makes headings and lists. (a) True (b) False
9. 9.⚖️ What colour is the text of this element?
   <p class="big" id="top">Hi</p>
   CSS:
   .big { color: yellow; }
   .big { color: black; } (a) purple (b) yellow (c) black (d) red
10. 10.🌐 Which one stores a website’s files? (a) a web browser (b) a web server (c) a code editor
11. 11.What does font-family do? (a) sets the letter colour (b) colours behind the text (c) picks the font style (d) centres a heading
12. 12.Which of these is a weak password? (a) Chai$Cup_19x (b) 111111 (c) Kite_Fl1es@Dawn (d) Blue@Tiger_74
13. 13.🔍 Which is the odd one out? (a) checks a quiz answer (b) reacts to a button click (c) lays out the page (d) changes the page live
14. 14.✍️ What value is given to color in this rule?
    li {
      text-align: center;
      color: red;
    } (a) 20px (b) center (c) color (d) red
15. 15.What does justify-content: flex-start do? (a) puts boxes in the middle (b) packs boxes at the end (c) equal gaps, none at ends (d) packs boxes at the start
16. 16.🚀 Which file should this code go in: #top { color: blue; } (a) script.js (b) style.css (c) index.html
17. 17.✍️ Which property is set to 300px in this rule?
    h2 {
      font-size: 20px;
      width: 300px;
      color: red;
      margin: 10px;
    } (a) width (b) 300px (c) color (d) font-style
18. 18.What is <input type="submit"> for? (a) is for an email address (b) lets you tick many (c) picks a day (d) sends the form
19. 19.📋 Which list tag goes inside ul or ol? (a) <li> (b) <ol> (c) <ul>
20. 20.🚀 Which file should this code go in: <p>Hello!</p> (a) style.css (b) script.js (c) index.html
21. 21.🌈 In #00b700 the green part is the hex number b7. What is it as a normal number?
22. 22.📄 What is the first line of an HTML5 page? (a) <head> (b) <!DOCTYPE html> (c) <body> (d) <html>
23. 23.Which colour pair is easy to read? (a) light grey on white (b) blue on purple (c) dark grey on white (d) red on green
24. 24.🖌️ What colour are the letters?
    h1 {
      font-size: 24px;
      color: black;
      background-color: green;
      text-align: right;
    } (a) yellow (b) black (c) green
25. 25.True or false: in <img>, alt names the picture file. (a) True (b) False
26. 26.🔗 Which address opens when you click this link?
    <a href="quiz.html">Take the quiz</a> (a) about.html (b) Take the quiz (c) games.html (d) quiz.html
27. 27.✍️ What is the selector in this CSS rule?
    p {
      padding: 8px;
      text-align: center;
      color: red;
    } (a) padding (b) p (c) .note (d) center
28. 28.True or false: “tiny grey text” makes the page harder to use. (a) False (b) True
29. 29.🏷️ Is </p> an opening tag or a closing tag? (a) an opening tag (b) a closing tag
30. 30.🧩 Which language sets colours and fonts? (a) HTML (b) JavaScript (c) CSS
31. 31.🔗 Which address opens when you click this link?
    <a href="https://example.com">Play games</a> (a) maths.html (b) art.html (c) https://example.com (d) Play games
32. 32.🌈 In #0000e8 the blue part is the hex number e8. What is it as a normal number?
33. 33.✍️ How many declarations (property: value pairs) are in this rule?
    #top {
      text-align: center;
    }
34. 34.🔢 When you open a web page, what comes right after “DNS finds the server”? (a) the browser shows it (b) you type the URL (c) the browser asks it (d) the server sends files
35. 35.⚖️ Two rules with the same selector set a colour. Which one wins? (a) neither (b) the first one (c) the shorter one (d) the later one
36. 36.True or false: <article> helps you move around. (a) False (b) True
37. 37.♿ A part of the page is under a <h5> heading. Which tag should its sub-heading use? (a) <h5> (b) <h2> (c) <h1> (d) <h6>
38. 38.⚡ What number does this code print?
    let marks = 28;
    marks = marks + 4;
    marks = marks - 21;
    console.log(marks);
39. 39.🔁 What does this code print?
    let temp = 18;
    if (temp < 21) {
      console.log("Hot");
    } else {
      console.log("Cool");
    } (a) Hot (b) Cool
40. 40.🖼️ Why do we add alt text to an image? (a) to load it faster (b) to make it bigger (c) to describe the image (d) to colour it

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