1. What is the primary role of a web server?
a) To display web pages to users
b) To store and deliver web content to clients
c) To design web pages
d) To manage databases
2. Which of the following is NOT a web standard?
a) HTML
b) CSS
c) FTP
d) HTTP
3. What does HTML stand for?
a) HyperText Markup Language
b) HighText Machine Language
c) HyperTransfer Markup Language
d) HomeTool Markup Language
4. Which CSS property is used to change the text color?
a) text-color
b) font-color
c) color
d) text-style
5. What is the purpose of JavaScript in web development?
a) To style web pages
b) To add interactivity and dynamic behavior
c) To structure web content
d) To manage server-side databases
6. Which of the following is a server-side scripting language?
a) HTML
b) CSS
c) JavaScript
d) PHP
7. What does DOM stand for?
a) Document Object Model
b) Data Object Model
c) Design Object Module
d) Dynamic Object Model
8. Which HTML tag is used to create a hyperlink?
a) <link>
b) <a>
c) <href>
d) <nav>
9. What is the correct syntax for referring to an external CSS file?
a) <style src='[Link]'>
b) <link rel='stylesheet' href='[Link]'>
c) <css href='[Link]'>
d) <script src='[Link]'>
10. Which JavaScript method is used to select an HTML element by its ID?
a) [Link]()
b) [Link]()
c) [Link]()
d) [Link]()
11. What is the purpose of MySQL in web development?
a) To style web pages
b) To manage databases
c) To create animations
d) To structure HTML content
12. Which of the following is NOT a valid HTTP method?
a) GET
b) POST
c) FETCH
d) PUT
13. What does the `box-model` in CSS refer to?
a) A model for creating 3D boxes
b) The layout of margins, borders, padding, and content
c) A JavaScript framework
d) A database structure
14. Which PHP function is used to connect to a MySQL database?
a) mysql_connect()
b) connect_db()
c) mysqli_connect()
d) db_connect()
15. What is the purpose of the `<meta>` tag in HTML?
a) To define metadata about the HTML document
b) To create a navigation menu
c) To embed multimedia
d) To style the page
16. Which CSS property is used to create space between elements?
a) margin
b) padding
c) spacing
d) border
17. What is the output of the following JavaScript code?
a) 10
b) 55
c) Error
d) '55'
18. Which PHP superglobal variable is used to collect form data sent via the POST method?
a) $_GET
b) $_POST
c) $_REQUEST
d) $_FORM
19. What is the purpose of the `z-index` property in CSS?
a) To control the transparency of an element
b) To set the stacking order of elements
c) To define the font size
d) To create animations
20. Which of the following is NOT a responsive design technique?
a) Media queries
b) Flexbox
c) Fixed-width layouts
d) Grid layout
ANSWERS
1. b) To store and deliver web content to clients
2. c) FTP
3. a) HyperText Markup Language
4. c) color
5. b) To add interactivity and dynamic behavior
6. d) PHP
7. a) Document Object Model
8. b) <a>
9. b) <link rel='stylesheet' href='[Link]'>
10. b) [Link]()
11. b) To manage databases
12. c) FETCH
13. b) The layout of margins, borders, padding, and content
14. c) mysqli_connect()
15. a) To define metadata about the HTML document
16. a) margin
17. b) '55'
18. b) $_POST
19. b) To set the stacking order of elements
20. c) Fixed-width layouts
MORE QUESTIONS
1. What is the purpose of the <header> tag in HTML?
a) To define the main content of a page
b) To create a footer for the document
c) To introduce the top section of a page or article
d) To embed multimedia
2. Which CSS property is used to control the font size of text?
a) font-style
b) font-size
c) text-size
d) text-style
3. What does CSS stand for?
a) Creative Style Sheets
b) Cascading Style Sheets
c) Computer Style Sheets
d) Custom Style Sheets
4. Which JavaScript function is used to print content to the console?
a) [Link]()
b) print()
c) display()
d) [Link]()
5. What is the purpose of the <footer> tag in HTML?
a) To define the main content of a page
b) To create a header for the document
c) To introduce the bottom section of a page or article
d) To embed multimedia
6. Which of the following is a front-end framework?
a) [Link]
b) Django
c) React
d) Laravel
7. What does the display: none CSS property do?
a) Hides an element and removes it from the document flow
b) Makes an element invisible but retains its space
c) Changes the element’s color
d) Adds a border to the element
8. Which HTML tag is used to create an ordered list?
a) <ul>
b) <ol>
c) <li>
d) <list>
9. What is the purpose of the localStorage object in JavaScript?
a) To store data temporarily during a session
b) To store data permanently in the user’s browser
c) To send data to a server
d) To create animations
10. Which of the following is NOT a valid CSS selector?
a) #id
b) .class
c) element > element
d) @element
11. What is the purpose of the <article> tag in HTML?
a) To define a section of navigation links
b) To represent a self-contained composition in a document
c) To embed multimedia
d) To create a footer
12. Which JavaScript method is used to add a new element to the end of an array?
a) push()
b) pop()
c) shift()
d) unshift()
13. What does the border-radius CSS property do?
a) Adds a border to an element
b) Rounds the corners of an element
c) Changes the border color
d) Adds space around an element
14. Which of the following is a valid way to include JavaScript in an HTML file?
a) <javascript src="[Link]">
b) <script src="[Link]">
c) <js src="[Link]">
d) <link src="[Link]">
15. What is the purpose of the <nav> tag in HTML?
a) To define the main content of a page
b) To create a navigation menu
c) To embed multimedia
d) To define a footer
16. Which CSS property is used to align text horizontally?
a) text-align
b) align-text
c) horizontal-align
d) text-position
17. What is the output of the following JavaScript code?
[Link](5 + "5");
a) 10
b) 55
c) Error
d) "55"
18. Which of the following is NOT a valid HTTP status code?
a) 200
b) 404
c) 500
d) 600
19. What is the purpose of the position: fixed CSS property?
a) To position an element relative to its normal position
b) To position an element relative to the viewport
c) To hide an element
d) To add a border to an element
20. Which of the following is NOT a semantic HTML tag?
a) <header>
b) <div>
c) <section>
d) <footer>
Correct Answers:
- 1. c) To introduce the top section of a page or article
- 2. b) font-size
- 3. b) Cascading Style Sheets
- 4. a) [Link]()
- 5. c) To introduce the bottom section of a page or article
- 6. c) React
- 7. a) Hides an element and removes it from the document flow
- 8. b) <ol>
- 9. b) To store data permanently in the user’s browser
- 10. d) @element
- 11. b) To represent a self-contained composition in a document
- 12. a) push()
- 13. b) Rounds the corners of an element
- 14. b) <script src="[Link]">
- 15. b) To create a navigation menu
- 16. a) text-align
- 17. d) "55"
- 18. d) 600
- 19. b) To position an element relative to the viewport
- 20. b) <div>
1. Explain the difference between inline, block, and inline-block elements in CSS.
2. Describe the role of the <script> tag in HTML.
3. What is the purpose of the fetch() API in JavaScript? Provide an example.
4. How does CSS Grid differ from Flexbox?
5. What are the advantages of using a CDN (Content Delivery Network) for web assets?
6. Explain the concept of 'event bubbling' in JavaScript.
7. What is the purpose of the async and defer attributes in the <script> tag?
ANSWERS
1. Explain the difference between inline, block, and inline-block elements in CSS.
Key Points:
- Inline: Does not start on a new line; only takes up as much width as necessary.
- Block: Starts on a new line; takes up the full width available.
- Inline-block: Combines features of both; starts on a new line but only takes necessary width.
2. Describe the role of the <script> tag in HTML.
Key Points:
- Used to embed or reference JavaScript code.
- Can be placed in the `<head>` or `<body>`.
- Supports attributes like `src`, `async`, and `defer`.
3. What is the purpose of the fetch() API in JavaScript? Provide an example.
Key Points:
- Used to make network requests (e.g., HTTP requests).
- Returns a promise that resolves to the response.
- Example: `fetch('[Link] => [Link]()).then(data
=> [Link](data));`
4. How does CSS Grid differ from Flexbox?
Key Points:
- CSS Grid: Two-dimensional layout system (rows and columns).
- Flexbox: One-dimensional layout system (either rows or columns).
- Grid is better for overall page layout; Flexbox is better for smaller components.
5. What are the advantages of using a CDN (Content Delivery Network) for web assets?
Key Points:
- Faster load times due to geographically distributed servers.
- Reduced bandwidth costs.
- Improved reliability and uptime.
6. Explain the concept of "event bubbling" in JavaScript.
Key Points:
- Events propagate from the target element up to the root of the DOM.
- Can be stopped using `[Link]()`.
- Useful for event delegation.
7. What is the purpose of the async and defer attributes in the <script> tag?
o Key Points:
o - `async`: Scripts load asynchronously and execute as soon as they are loaded.
- `defer`: Scripts load asynchronously but execute after the HTML is parsed
MORE
1. Explain the client-server architecture in web development.
2. Describe the difference between HTML and CSS.
3. What is the purpose of JavaScript’s `addEventListener` method? Provide an example.
4. How does PHP interact with a MySQL database?
5. What are the key principles of responsive web design?
6. Explain the role of the `box-model` in CSS.
7. What is the difference between `GET` and `POST` methods in HTTP?
ANSWERS
1. Client-server architecture involves a client (e.g., web browser) requesting resources from a
server (e.g., web server), which processes and delivers the requested content.
2. HTML defines the structure and content of a web page, while CSS is used to style and
layout the content.
3. `addEventListener` attaches an event handler to an element. Example:
`[Link]('click', function() { alert('Clicked!'); });`
4. PHP interacts with MySQL using functions like `mysqli_connect()` to establish a
connection and `mysqli_query()` to execute SQL queries.
5. Responsive design principles include fluid grids, flexible images, and media queries to
adapt layouts to different screen sizes.
6. The `box-model` in CSS defines how elements are rendered, including margins, borders,
padding, and content.
7. `GET` sends data via the URL, while `POST` sends data in the HTTP request body,
making it more secure for sensitive information.
Match the terms in Column A with their descriptions in Column B.
Set 1: Match the following HTML/CSS terms with their descriptions.
Column A Column B
1. <div> a) Used to define the structure of a table
2. float b) A container for grouping elements
3. <table> c) Used to position elements horizontally or
vertically
4. margin d) Defines the space outside an element
5. padding e) Defines the space inside an element
Set 2: Match the following JavaScript/PHP terms with their descriptions.
Column A Column B
1. [Link]() a) Used to send data to a server
2. mysqli_query() b) Selects an HTML element by its ID
3. XMLHttpRequest c) Executes a query on a MySQL database
4. $_POST d) Collects data sent via the POST method
5. addEventListener() e) Attaches an event handler to an element
Set 3: Match the following Web Development Terms with their Descriptions
Column A Column B
1. <form> a) Used to create a list of items
2. flexbox b) A container for user input elements
3. <ul> c) A CSS layout model for distributing space
4. JavaScript d) A language for adding interactivity to
websites
5. CSS Grid e) A two-dimensional layout system for the
web
Set 4: Match the following Server-Side and Database Terms with their Descriptions
Column A Column B
1. SQL a) A server-side scripting language
2. PHP b) A query language for managing databases
3. Session c) A method for storing user data temporarily
4. Cookie d) A small piece of data stored in the user's
browser
5. AJAX e) A technique for asynchronous web requests
ANSWERS
Set 1:
1. b) A container for grouping elements
2. c) Used to position elements horizontally or vertically
3. a) Used to define the structure of a table
4. d) Defines the space outside an element
5. e) Defines the space inside an element
Set 2:
1. b) Selects an HTML element by its ID
2. c) Executes a query on a MySQL database
3. a) Used to send data to a server
4. d) Collects data sent via the POST method
5. e) Attaches an event handler to an element
Set 3: Answers
1. b) A container for user input elements
2. c) A CSS layout model for distributing space
3. a) Used to create a list of items
4. d) A language for adding interactivity to websites
5. e) A two-dimensional layout system for the web
Set 4: Answers
1. b) A query language for managing databases
2. a) A server-side scripting language
3. c) A method for storing user data temporarily
4. d) A small piece of data stored in the user's browser
5. e) A technique for asynchronous web requests
MORE
Match the terms in Column A with their descriptions in Column B.
Set 1: Match the following HTML/CSS terms with their descriptions.
Column A Column B
1. <section> a) Used to define a container for metadata
2. opacity b) A block-level container for content
3. <meta> c) Controls the transparency of an element
4. flex-wrap d) Allows flex items to wrap onto multiple lines
5. em e) A relative unit of font size
Set 2: Match the following JavaScript/PHP terms with their descriptions.
Column A Column B
1. [Link]() a) Converts a JavaScript object to a JSON string
2. session_start() b) Parses a JSON string into a JavaScript object
3. [Link]() c) Starts a PHP session
4. addEventListener() d) Attaches an event handler to an element
5. include() e) Includes and evaluates a PHP file
Set 3: Match the following Web Development Terms with their Descriptions.
Column A Column B
1. <canvas> a) Used to create scalable vector graphics
2. viewport b) A container for drawing graphics
3. <svg> c) Controls the layout on mobile devices
Column A Column B
d) A relative unit based on the root font
4. rem
size
5. transition e) Animates changes in CSS properties
Set 4: Match the following Server-Side and Database Terms with their Descriptions.
Column A Column B
1. PDO a) A lightweight data interchange format
2. JSON b) A PHP extension for database access
3. Prepared Statements c) Protects against SQL injection
4. REST d) An architectural style for APIs
5. ORM e) Maps database tables to objects
ANSWERS
Set 1: HTML/CSS Terms
Correct Matches:
- 1. <section> → b) A block-level container for content
- 2. opacity → c) Controls the transparency of an element
- 3. <meta> → a) Used to define a container for metadata
- 4. flex-wrap → d) Allows flex items to wrap onto multiple lines
- 5. em → e) A relative unit of font size
Set 2: JavaScript/PHP Terms
Correct Matches:
- 1. [Link]() → b) Parses a JSON string into a JavaScript object
- 2. session_start() → c) Starts a PHP session
- 3. [Link]() → a) Converts a JavaScript object to a JSON string
- 4. addEventListener() → d) Attaches an event handler to an element
- 5. include() → e) Includes and evaluates a PHP file
Set 3: Web Development Terms
Correct Matches:
- 1. <canvas> → b) A container for drawing graphics
- 2. viewport → c) Controls the layout on mobile devices
- 3. <svg> → a) Used to create scalable vector graphics
- 4. rem → d) A relative unit based on the root font size
- 5. transition → e) Animates changes in CSS properties
Set 4: Server-Side and Database Terms
Correct Matches:
- 1. PDO → b) A PHP extension for database access
- 2. JSON → a) A lightweight data interchange format
- 3. Prepared Statements → c) Protects against SQL injection
- 4. REST → d) An architectural style for APIs
- 5. ORM → e) Maps database tables to objects