NumicornNumicornLearn, solve, progress

Web Development Basics Practice Tests

These Grade 10 Additional Subjects practice tests introduce HTML structure, CSS styling, responsive design, JavaScript behavior, the DOM, forms, HTTP, client-server architecture, databases, accessibility, security, testing, version control, performance, and deployment.

Skills covered

  • Using HTML elements, semantic structure, headings, links, images, and alternative text
  • Applying CSS selectors, classes, the box model, layout, media queries, specificity, contrast, and responsive design
  • Understanding JavaScript events, the DOM, validation, arrays, functions, JSON, asynchronous requests, and client-server interaction
  • Explaining URLs, HTTP methods and status codes, HTTPS, servers, databases, cookies, caching, and deployment
  • Applying accessibility, cross-browser testing, version control, performance, privacy, authentication, password protection, and XSS prevention

How to use these practice tests

Identify which layer is responsible for the behavior: HTML for structure, CSS for presentation, JavaScript for interaction, the server for application logic, and the database for persistent data. Then check accessibility and security requirements.

For more Grade 10 Additional Subjects practice, return to the Grade 10 Additional Subjects category.

Select a test

5 Tests
1. Test2. Test3. Test4. Test5. Test

2. Test

Grade 10 Web Development Basics Practice Tests

Practice Grade 10 Additional Subjects questions about HTML, CSS, JavaScript, the DOM, HTTP, client-server architecture, accessibility, security, testing, and deployment.

Choose the best answer. Identify the role of each web technology, trace browser-server interactions, and apply accessibility, security, testing, and performance principles.

10 Questions
0/10 Questions0 %
Correct 0
Incorrect 0
Unanswered 10
1. QuestionMultiple choice

What is a CSS selector?

Please select an answer first.

Correct answer: A

The correct answer is A pattern used to choose which elements receive styles.

  1. Identify the web development concept: Determine whether the question asks about structure, style, behavior, networking, accessibility, security, testing, or deployment.
  2. Connect the evidence: Selectors target elements by type, class, id, attributes, relationships, or other conditions.
  3. Check the conclusion: The correct answer is A pattern used to choose which elements receive styles.

Selectors target elements by type, class, id, attributes, relationships, or other conditions.

2. QuestionMultiple choice

What does the CSS box model describe?

Please select an answer first.

Correct answer: B

The correct answer is Content, padding, border, and margin around an element.

  1. Identify the web development concept: Determine whether the question asks about structure, style, behavior, networking, accessibility, security, testing, or deployment.
  2. Connect the evidence: The box model explains how an element's content and surrounding spacing contribute to its rendered size.
  3. Check the conclusion: The correct answer is Content, padding, border, and margin around an element.

The box model explains how an element's content and surrounding spacing contribute to its rendered size.

3. QuestionMultiple choice

What is the purpose of a CSS class?

Please select an answer first.

Correct answer: C

The correct answer is To group elements that share a style or behavior target.

  1. Identify the web development concept: Determine whether the question asks about structure, style, behavior, networking, accessibility, security, testing, or deployment.
  2. Connect the evidence: A class can be applied to multiple elements and selected with a dot selector such as .card.
  3. Check the conclusion: The correct answer is To group elements that share a style or behavior target.

A class can be applied to multiple elements and selected with a dot selector such as .card.

4. QuestionMultiple choice

What is responsive web design?

Please select an answer first.

Correct answer: D

The correct answer is Designing pages that adapt to different screen sizes and devices.

  1. Identify the web development concept: Determine whether the question asks about structure, style, behavior, networking, accessibility, security, testing, or deployment.
  2. Connect the evidence: Responsive layouts use flexible dimensions, media queries, and adaptable components for phones, tablets, and desktops.
  3. Check the conclusion: The correct answer is Designing pages that adapt to different screen sizes and devices.

Responsive layouts use flexible dimensions, media queries, and adaptable components for phones, tablets, and desktops.

5. QuestionMultiple choice

What does a media query do?

Please select an answer first.

Correct answer: A

The correct answer is It applies CSS rules when conditions such as viewport width are met..

  1. Identify the web development concept: Determine whether the question asks about structure, style, behavior, networking, accessibility, security, testing, or deployment.
  2. Connect the evidence: Media queries allow styles to change based on screen size, orientation, resolution, or other media features.
  3. Check the conclusion: The correct answer is It applies CSS rules when conditions such as viewport width are met..

Media queries allow styles to change based on screen size, orientation, resolution, or other media features.

6. QuestionMultiple choice

What is CSS specificity?

Please select an answer first.

Correct answer: B

The correct answer is The rule used to determine which conflicting style declaration has priority.

  1. Identify the web development concept: Determine whether the question asks about structure, style, behavior, networking, accessibility, security, testing, or deployment.
  2. Connect the evidence: Specificity helps the browser resolve competing selectors, together with source order and importance.
  3. Check the conclusion: The correct answer is The rule used to determine which conflicting style declaration has priority.

Specificity helps the browser resolve competing selectors, together with source order and importance.

7. QuestionMultiple choice

Why is a flexible layout useful?

Please select an answer first.

Correct answer: C

The correct answer is It can use available space and adapt as the viewport or content changes..

  1. Identify the web development concept: Determine whether the question asks about structure, style, behavior, networking, accessibility, security, testing, or deployment.
  2. Connect the evidence: Flexible units and layout systems such as flexbox or grid help content respond to different conditions.
  3. Check the conclusion: The correct answer is It can use available space and adapt as the viewport or content changes..

Flexible units and layout systems such as flexbox or grid help content respond to different conditions.

8. QuestionMultiple choice

What is the purpose of a CSS reset or normalization strategy?

Please select an answer first.

Correct answer: D

The correct answer is To reduce inconsistent default styling across browsers.

  1. Identify the web development concept: Determine whether the question asks about structure, style, behavior, networking, accessibility, security, testing, or deployment.
  2. Connect the evidence: Browsers have different default styles, so reset or normalization rules create a more predictable starting point.
  3. Check the conclusion: The correct answer is To reduce inconsistent default styling across browsers.

Browsers have different default styles, so reset or normalization rules create a more predictable starting point.

9. QuestionMultiple choice

What does the CSS display property influence?

Please select an answer first.

Correct answer: A

The correct answer is How an element participates in layout and whether it is shown.

  1. Identify the web development concept: Determine whether the question asks about structure, style, behavior, networking, accessibility, security, testing, or deployment.
  2. Connect the evidence: Display values affect layout behavior, such as block, inline, flex, grid, or none.
  3. Check the conclusion: The correct answer is How an element participates in layout and whether it is shown.

Display values affect layout behavior, such as block, inline, flex, grid, or none.

10. QuestionMultiple choice

Why should color contrast be checked?

Please select an answer first.

Correct answer: B

The correct answer is Sufficient contrast helps users read and distinguish content..

  1. Identify the web development concept: Determine whether the question asks about structure, style, behavior, networking, accessibility, security, testing, or deployment.
  2. Connect the evidence: Accessible contrast supports users with low vision and makes content easier to read in different conditions.
  3. Check the conclusion: The correct answer is Sufficient contrast helps users read and distinguish content..

Accessible contrast supports users with low vision and makes content easier to read in different conditions.

Previous testNext test