Questions: Web Technologies
Back to Topics List

Web Technologies Questions

Page 1 of 13 (Displaying Questions 1 – 100 of 1207 Total)

1. What is HTML and what is its primary purpose?

Show Answer

HTML (HyperText Markup Language) is the standard markup language for creating web pages and defining their structure.

Added: Nov 30, 2025

2. What is a semantic element in HTML?

Show Answer

A semantic element clearly describes its meaning to both the browser and the developer (e.g., <header>, <article>, <footer>).

Added: Nov 30, 2025

3. What is the purpose of the DOCTYPE declaration?

Show Answer

It tells the browser which version of HTML (or XML) the document is written in, ensuring correct rendering.

Added: Nov 30, 2025

4. How do you include an external CSS file in an HTML document?

Show Answer

Using the <link> tag within the <head> section: <link rel="stylesheet" href="styles.css">.

Added: Nov 30, 2025

5. What is the difference between a block element and an inline element?

Show Answer

Block elements occupy the entire width available and start a new line (<div>, <p>). Inline elements only occupy the necessary width and do not start a new line (<span>, <a>).

Added: Nov 30, 2025

6. What is the alt attribute used for in the <img> tag?

Show Answer

It provides alternative text for an image if the image cannot be displayed, and is crucial for accessibility (screen readers).

Added: Nov 30, 2025

7. How do you open a link in a new tab?

Show Answer

By adding the target="_blank" attribute to the <a> tag.

Added: Nov 30, 2025

8. What are HTML entities?

Show Answer

Character codes used to display reserved characters (like < or >) or special characters (like non-breaking space &nbsp;).

Added: Nov 30, 2025

9. Explain the use of the <meta> tag.

Show Answer

It provides metadata about the HTML document, such as character set, viewport settings, and author information.

Added: Nov 30, 2025

10. What is the difference between the id and class attributes?

Show Answer

id must be unique per element and is used for styling or scripting a single element. class can be used on multiple elements for applying reusable styles.

Added: Nov 30, 2025

11. How do you embed a video in HTML5?

Show Answer

Using the <video> tag with the src attribute pointing to the video file, optionally including controls.

Added: Nov 30, 2025

12. What is the purpose of the <canvas> element?

Show Answer

It is used to draw graphics on a web page, via scripting (usually JavaScript).

Added: Nov 30, 2025

13. What are data attributes in HTML5?

Show Answer

Attributes prefixed with data- used to store custom data private to the page or application.

Added: Nov 30, 2025

14. How do you make a form field required?

Show Answer

By adding the required attribute to the input element.

Added: Nov 30, 2025

15. What is the difference between <section> and <article>?

Show Answer

<article> is for self-contained, independent content. <section> is for grouping related content within an article or the document.

Added: Nov 30, 2025

16. What is the purpose of the aria-* attributes?

Show Answer

They define ways to make web content and applications more accessible to people with disabilities (WAI-ARIA).

Added: Nov 30, 2025

17. Where should the script tags be ideally placed?

Show Answer

Just before the closing </body> tag to allow the HTML content to load first, preventing page rendering delays.

Added: Nov 30, 2025

18. What is the role of the defer attribute on a script?

Show Answer

It tells the browser to download the script in parallel with parsing the document, and execute it after the document has finished parsing.

Added: Nov 30, 2025

19. How is the <figcaption> element used?

Show Answer

It provides a caption or legend for the content of its parent <figure> element.

Added: Nov 30, 2025

20. How do you specify alternative text for responsive images using srcset?

Show Answer

The alt attribute is added to the parent <img> tag, which applies regardless of which source is selected from srcset.

Added: Nov 30, 2025

21. What is the default character set in HTML5?

Show Answer

UTF-8.

Added: Nov 30, 2025

22. What is the function of the <details> and <summary> tags?

Show Answer

They create a disclosure widget where the content in <details> can be hidden or shown by clicking the <summary>.

Added: Nov 30, 2025

23. How do you make an input field read-only?

Show Answer

By adding the readonly attribute to the input element.

Added: Nov 30, 2025

24. What does the novalidate attribute do on a form?

Show Answer

It disables the browser's default form validation when the form is submitted.

Added: Nov 30, 2025

25. What are HTML comments and how are they written?

Show Answer

Text ignored by the browser, used for developer notes: .

Added: Nov 30, 2025

26. What is an anchor tag?

Show Answer

The <a> tag, used to define a hyperlink.

Added: Nov 30, 2025

27. How do you specify the input type for an email address?

Show Answer

Using <input type="email">.

Added: Nov 30, 2025

28. What is the purpose of the name attribute in a form input?

Show Answer

It is used to identify the form data after it is submitted to the server.

Added: Nov 30, 2025

29. What is the root element in an HTML document?

Show Answer

<html>.

Added: Nov 30, 2025

30. What is inline styling?

Show Answer

Applying CSS styles directly to an HTML element using the style attribute.

Added: Nov 30, 2025

31. What is the difference between an HTML element and an HTML tag?

Show Answer

An HTML tag is the opening or closing marker (e.g., <div>). An HTML element includes the opening tag, content, and closing tag.

Added: Nov 30, 2025

32. How do you create an ordered list and an unordered list?

Show Answer

Ordered lists use <ol> and list items use <li>. Unordered lists use <ul> and list items use <li>.

Added: Nov 30, 2025

33. What is the role of the <base> tag?

Show Answer

It specifies the base URL and/or target for all relative URLs in a document.

Added: Nov 30, 2025

34. What is the function of the <time> tag?

Show Answer

It defines a specific time or a date/time value.

Added: Nov 30, 2025

35. How do you make an input field disabled?

Show Answer

By adding the disabled attribute to the input element.

Added: Nov 30, 2025

36. What is the "C" in CSS?

Show Answer

Cascading. It defines how styles flow down from various sources and how conflicts are resolved.

Added: Nov 30, 2025

37. Explain CSS specificity.

Show Answer

It is the set of rules browsers use to determine which CSS property values apply to an element when multiple rules target it.

Added: Nov 30, 2025

38. What is the CSS Box Model?

Show Answer

A model that wraps every HTML element in a box consisting of content, padding, border, and margin.

Added: Nov 30, 2025

39. How do you center a block element horizontally?

Show Answer

Set its width and then set margin: 0 auto;.

Added: Nov 30, 2025

40. What is the difference between display: none; and visibility: hidden;?

Show Answer

display: none; removes the element from the document flow. visibility: hidden; hides the element but it still occupies its space.

Added: Nov 30, 2025

41. What is Flexbox?

Show Answer

A one-dimensional CSS layout module designed for arranging items in rows or columns, making alignment and spacing easier.

Added: Nov 30, 2025

42. What is CSS Grid?

Show Answer

A two-dimensional CSS layout module designed for arranging items in rows and columns simultaneously.

Added: Nov 30, 2025

43. What is a media query?

Show Answer

A CSS technique used to apply styles based on device characteristics, most commonly screen size, for responsive design.

Added: Nov 30, 2025

44. Explain the z-index property.

Show Answer

It specifies the stack order of a positioned element (one with position: absolute, relative, fixed, or sticky). Higher values are closer to the user.

Added: Nov 30, 2025

45. What is the difference between em and rem units?

Show Answer

em is relative to the parent element's font size. rem (root em) is relative to the root HTML element's font size.

Added: Nov 30, 2025

46. What are pseudo-classes? Give an example.

Show Answer

Keywords added to a selector to specify a special state of the element, such as :hover or :active.

Added: Nov 30, 2025

47. What are pseudo-elements? Give an example.

Show Answer

Keywords added to a selector to style a specific part of an element, such as ::before or ::after.

Added: Nov 30, 2025

48. How do you clear a floating element?

Show Answer

Using the clearfix technique (applied to the parent) or setting the parent's overflow: auto;.

Added: Nov 30, 2025

49. What is the default value of the position property?

Show Answer

static.

Added: Nov 30, 2025

50. What are CSS custom properties (variables)?

Show Answer

Entities defined by CSS authors that contain specific values to be reused throughout a document. They start with --.

Added: Nov 30, 2025

51. What is vendor prefixing?

Show Answer

Adding a prefix (like -webkit- or -moz-) to experimental or non-standard CSS properties to ensure compatibility across different browsers.

Added: Nov 30, 2025

52. How does the box-sizing property work?

Show Answer

It defines how the total width and height of an element are calculated. border-box includes padding/border in the total size.

Added: Nov 30, 2025

53. What is the transition property used for?

Show Answer

It allows you to define smooth, animated transitions between two states of a property value over a given duration.

Added: Nov 30, 2025

54. What is the purpose of the calc() function?

Show Answer

It allows you to perform basic arithmetic operations (addition, subtraction, multiplication, division) to set property values.

Added: Nov 30, 2025

55. How do you hide an element without removing it from the document flow?

Show Answer

Using visibility: hidden; or setting opacity: 0;.

Added: Nov 30, 2025

56. What are keyframes in CSS?

Show Answer

They are points in a CSS animation sequence where you explicitly define the styles that must occur at specific times (percentages).

Added: Nov 30, 2025

57. What is the difference between min-width and max-width in responsiveness?

Show Answer

min-width is mobile-first (styles apply when viewport is at least this wide). max-width is desktop-first (styles apply when viewport is at most this wide).

Added: Nov 30, 2025

58. How can you link to a local font file?

Show Answer

Using the @font-face rule.

Added: Nov 30, 2025

59. What is the initial value keyword?

Show Answer

It resets the value of a property to its default value as specified in the CSS specification.

Added: Nov 30, 2025

60. What is the purpose of the opacity property?

Show Answer

It sets the transparency level of an element (from 0.0 to 1.0).

Added: Nov 30, 2025

61. What is the clip-path property used for?

Show Answer

It is used to create complex shapes for an element's visibility area, hiding parts outside the shape.

Added: Nov 30, 2025

62. How do you apply styles only when an element is focused?

Show Answer

Using the :focus pseudo-class.

Added: Nov 30, 2025

63. What does the border-radius property do?

Show Answer

It is used to round the corners of an element's border.

Added: Nov 30, 2025

64. What is the difference between color and background-color?

Show Answer

color sets the foreground color of text. background-color sets the background color of the element box.

Added: Nov 30, 2025

65. What is the CSS property for creating shadows?

Show Answer

box-shadow for element boxes and text-shadow for text.

Added: Nov 30, 2025

66. What is JavaScript and how is it primarily used on the web?

Show Answer

A client-side scripting language used to make web pages interactive and dynamic, handling behavior.

Added: Nov 30, 2025

67. What is the difference between == and ===?

Show Answer

== performs type coercion (compares values after converting types). === compares values and types strictly (no coercion).

Added: Nov 30, 2025

68. Explain hoisting in JavaScript.

Show Answer

A mechanism where variable and function declarations are moved to the top of their scope during compilation, though initialization remains in place.

Added: Nov 30, 2025

69. What is a closure?

Show Answer

The ability of a function to retain access to variables from its parent's scope even after the parent function has finished executing.

Added: Nov 30, 2025

70. What is the DOM?

Show Answer

The Document Object Model is a programming interface for web documents. It represents the page so that programs can change the document structure, style, and content.

Added: Nov 30, 2025

71. How do you select an element by its ID using JavaScript?

Show Answer

Using document.getElementById('elementId') or document.querySelector('#elementId').

Added: Nov 30, 2025

72. What is the difference between let, const, and var?

Show Answer

var is function-scoped. let and const are block-scoped. const variables cannot be reassigned.

Added: Nov 30, 2025

73. What is an event bubble?

Show Answer

The process where an event triggered on a nested element is first handled by that element, then by its parent, and so on up the DOM tree.

Added: Nov 30, 2025

74. What is the use of the addEventListener method?

Show Answer

It attaches an event handler to an element without overwriting existing handlers, allowing multiple functions to run on the same event.

Added: Nov 30, 2025

75. How do you make an AJAX request using the modern fetch API?

Show Answer

Using the global fetch() method, which returns a Promise that resolves to the Response object.

Added: Nov 30, 2025

76. What is a Promise?

Show Answer

An object representing the eventual completion (or failure) of an asynchronous operation and its resulting value.

Added: Nov 30, 2025

77. Explain the purpose of async and await.

Show Answer

async defines an asynchronous function that returns a Promise. await pauses the execution of the async function until a Promise is settled (resolved or rejected).

Added: Nov 30, 2025

78. What are template literals?

Show Answer

String literals enclosed by backticks (`) that allow embedded expressions using ${expression} and support multi-line strings.

Added: Nov 30, 2025

79. What is the spread operator (...) used for?

Show Answer

To expand an iterable (like an array or string) into its individual elements, often used for merging arrays or copying objects.

Added: Nov 30, 2025

80. What is type coercion?

Show Answer

The automatic conversion of values from one data type to another during an operation like 5 + '5'.

Added: Nov 30, 2025

81. What is the concept of scope?

Show Answer

The accessibility of variables, functions, and objects in some particular part of your code. (Global, Function, Block).

Added: Nov 30, 2025

82. How do you check the data type of a variable?

Show Answer

Using the typeof operator.

Added: Nov 30, 2025

83. What does 'use strict'; do?

Show Answer

It enables strict mode, which imposes restrictions on certain JavaScript syntax and silences some errors by throwing them instead.

Added: Nov 30, 2025

84. What is JSON?

Show Answer

JavaScript Object Notation, a lightweight data-interchange format that is easy for humans to read and write, and for machines to parse and generate.

Added: Nov 30, 2025

85. What is prototypal inheritance?

Show Answer

A mechanism where JavaScript objects inherit features from one another via their prototype chain rather than using traditional class-based inheritance.

Added: Nov 30, 2025

86. What is destructuring assignment?

Show Answer

A syntax that allows you to unpack values from arrays or properties from objects into distinct variables.

Added: Nov 30, 2025

87. What is the difference between a synchronous and an asynchronous operation?

Show Answer

Synchronous operations execute sequentially, blocking the main thread. Asynchronous operations execute independently without blocking the main thread.

Added: Nov 30, 2025

88. What are higher-order functions?

Show Answer

Functions that either take one or more functions as arguments or return a function as a result (e.g., map, filter).

Added: Nov 30, 2025

89. How do you handle errors in a Promise chain?

Show Answer

By using the .catch() method at the end of the chain.

Added: Nov 30, 2025

90. What is the Event Loop?

Show Answer

A fundamental concurrency model in JavaScript that handles asynchronous callbacks by managing the execution stack and the task queue.

Added: Nov 30, 2025

91. What is a callback function?

Show Answer

A function passed into another function as an argument, which is then executed inside the outer function.

Added: Nov 30, 2025

92. What is the difference between innerHTML and textContent?

Show Answer

innerHTML retrieves or sets the content of an element, including HTML markup. textContent retrieves or sets only the text content, without markup.

Added: Nov 30, 2025

93. What is the use of the this keyword?

Show Answer

this refers to the object it belongs to, which changes based on where and how the function is called.

Added: Nov 30, 2025

94. How can you prevent event bubbling?

Show Answer

By using the event.stopPropagation() method within the event handler.

Added: Nov 30, 2025

95. What is the difference between the Array methods map and forEach?

Show Answer

forEach executes a function for each array element and returns undefined. map creates a new array populated with the results of calling a provided function on every element.

Added: Nov 30, 2025

96. What is the difference between the Internet and the World Wide Web (WWW)?

Show Answer

The Internet is the global network of interconnected computers. The WWW is a collection of documents and resources (web pages) accessed via the Internet.

Added: Nov 30, 2025

97. What are the main components of a URL?

Show Answer

Protocol (e.g., HTTP), domain name, port (optional), path, and query parameters (optional).

Added: Nov 30, 2025

98. Name the common HTTP request methods.

Show Answer

GET, POST, PUT, DELETE, PATCH.

Added: Nov 30, 2025

99. What is the difference between HTTP and HTTPS?

Show Answer

HTTPS is the secure version of HTTP. It uses SSL/TLS encryption to secure communication between the browser and the server.

Added: Nov 30, 2025

100. What is DNS?

Show Answer

The Domain Name System, which translates human-readable domain names (like google.com) into numerical IP addresses.

Added: Nov 30, 2025