HTML

1. What is HTML?

A: HTML (HyperText Markup Language) is the standard markup language for creating webpages.

2. What is the latest version of HTML?

A: HTML5.

3. What does HTML stand for?

A: HyperText Markup Language.

4. What are HTML tags?

A: Tags are keywords enclosed in angle brackets (e.g. <p>) that define elements in HTML.

5. What is an HTML attribute?

A: Attributes provide additional information about elements. Example:

<a href="https://example.com">Link</a>

6. What is the difference between HTML elements and tags?

Tag: The markup like <p>.
Element: Everything from the start tag to end tag including content: <p>Hello</p>.

7. What are void (self-closing) elements in HTML?

A: Elements that don’t need a closing tag. Examples: <img>, <br>, <hr>, <input>.

8. What is the use of `<!DOCTYPE html>`?

A: Declares the document type and version of HTML to the browser.

9. What is semantic HTML?

A: Using tags that convey meaning (like <article>, <header>) instead of just presentation.

10. What is the purpose of comments in HTML?

A: To leave notes for developers.

<!-- This is a comment -->

11. What tags define the basic structure of an HTML document?

<!DOCTYPE html>
<html>
<head>...</head>
<body>...</body>
</html>

12. What is the `<head>` tag used for?

A: Metadata, title, links to CSS, scripts.

13. What goes inside the `<body>` tag?

A: The content that displays on the webpage.

14. What is the `<title>` tag used for?

A: Sets the title shown in the browser tab.

15. What is the difference between `<head>` and `<body>`?

<head>: metadata, not directly visible.
<body>: content shown to users.

16. How do you create headings in HTML?

<h1>Heading 1</h1> to <h6>Heading 6</h6>

17. How do you create a paragraph?

<p>This is a paragraph.</p>

18. Difference between `<strong>` and `<b>`?

<strong>: semantic, emphasizes importance.
<b>: purely bold visual style.

19. Difference between `<em>` and `<i>`?

<em>: emphasizes text (semantic).
<i>: italicizes visually.

20. How to insert a line break?

First line<br>Second line

21. How to create horizontal lines?

<hr>

22. How to make text subscript or superscript?

H<sub>2</sub>O and 
x<sup>2</sup>

23. How do you create a blockquote?

<blockquote>This is a quote.</blockquote>

24. What is the `<pre>` tag?

A: Preserves whitespace and line breaks.

<pre>
  Text keeps
  its formatting.
</pre>

25. How do you display code snippets?

<code>let x = 5;</code>

26. How to create a hyperlink?

<a href="https://example.com">Visit</a>

27. What is the target attribute?

A: Defines where to open the link.

<a href="..." target="_blank">New Tab</a>

28. Difference between absolute and relative URLs?

Absolute: full path (https://site.com/page).
Relative: from current location (/page).

29. How to create an email link?

<a href="mailto:test@example.com">Email us</a>

30. How to make a phone call link?

<a href="tel:+1234567890">Call us</a>

31. Types of lists in HTML?

Ordered (<ol>)
Unordered (<ul>)
Definition (<dl>)

32. How to create an ordered list?

<ol><li>Item</li></ol>

33. How to create an unordered list?

<ul><li>Item</li></ul>

34. How to create a definition list?

<dl>
  <dt>HTML</dt>
  <dd>Markup language</dd>
</dl>

35. Can lists be nested?

A: Yes.

<ul>
  <li>Item
    <ul><li>Subitem</li></ul>
  </li>
</ul>

36. How to insert an image?

<img src="image.jpg" alt="Description">

37. What is the alt attribute?

A: Text shown if image can’t load (important for accessibility).

38. How to add a clickable image?

<a href="page.html"><img src="img.jpg"></a>

39. How to embed a video?

<video controls>
  <source src="movie.mp4" type="video/mp4">
</video>

40. How to embed audio?

<audio controls>
  <source src="audio.mp3" type="audio/mpeg">
</audio>

41. How to display SVG?

<img src="image.svg" alt="">

or embed SVG code directly.

42. What is `<canvas>` used for?

A: Drawing graphics via JavaScript.

43. How do you create a table?

<table>
  <tr><th>Header</th></tr>
  <tr><td>Data</td></tr>
</table>

44. What are `<thead>`, `<tbody>`, `<tfoot>`?

A: Structure tables into

<thead> – header,
<tbody> – body,
<tfoot> - footer sections.

45. What is `<caption>`?

A: Title of the table.

<table>
  <caption>Monthly Report</caption>
</table>

46. How to merge cells?

<td colspan="2">Merged</td>
<td rowspan="2">Merged</td>

47. Difference between `<th>` and `<td>`?

<th>: header cell (bold, centered by default)
<td>: regular data cell.

48. How to create a form?

<form action="/submit" method="post">
</form>

49. Common form elements?

<input>, <textarea>, <select>, <button>.

50. What is action?

A: URL where form data is sent.

51. What is method?

GET: appends data to URL.
POST: sends data in body.

52. How to create a text input?

<input type="text" name="username">

53. How to create radio buttons?

<input type="radio" name="gender" value="male"> Male

54. How to create checkboxes?

<input type="checkbox" name="hobby" value="music">

<select><option>Option</option></select>

56. How to create multi-select?

<select multiple></select>

57. How to create a submit button?

<input type="submit" value="Submit">

58. What is a hidden input?

<input type="hidden" name="id" value="123">

59. What is `<label>` for?

A: Associates text with a form control.

<label for="email">Email</label>
<input id="email" type="email">

60. How to group with `<fieldset>` and `<legend>`?

<fieldset>
  <legend>Contact Info</legend>
</fieldset>

61. New HTML5 input types?

email, tel, url, number, date, range, color.

62. How to create a date picker?

<input type="date">

63. How to create a color picker?

<input type="color">

64. How to validate an email?

<input type="email">

65. How to validate with pattern?

<input pattern="[A-Za-z]{3}">

66. What is `<meta>`?

A: Defines metadata like charset, viewport, description.

67. How to set charset?

<meta charset="UTF-8">

68. How to set viewport for mobile?

<meta name="viewport" content="width=device-width, initial-scale=1.0">

69. How to set description?

<meta name="description" content="Site description">

70. How to redirect with meta?

<meta http-equiv="refresh" content="5;url=https://example.com">

71. Examples of semantic tags?

<article>, <section>, <aside>, <nav>, <header>, <footer>.

72. What is `<section>` for?

A: Defines a thematic grouping of content.

73. What is `<article>` for?

A: Independent content, like a blog post.

74. What is `<aside>` for?

A: Sidebar or additional info.

75. What is `<nav>` for?

A: Navigation links.

76. What is `<header>` and `<footer>`?

A: Top and bottom sections of a page or section.

77. How to improve accessibility?

Use alt text for images.
Use ARIA roles.
Use semantic tags.

78. How to embed YouTube?

<iframe src="https://www.youtube.com/embed/ID"></iframe>

79. What is `<iframe>`?

A: Embeds another webpage.

80. How to embed PDF?

<iframe src="file.pdf"></iframe>

81. How to include JavaScript?

<script src="script.js"></script>

82. How to include CSS?

<link rel="stylesheet" href="styles.css">

83. `<script>` in head vs body?

Head: blocks parsing.
Body (bottom): loads after content.

84. What does defer do?

A: Runs script after HTML is parsed.

85. What does async do?

A: Loads script asynchronously.

86. What is class?

A: Groups elements for CSS/JS.

87. What is id?

A: Uniquely identifies an element.

88. What is style?

A: Inline CSS.

<p style="color:red;">Hello</p>

89. What is title?

A: Tooltip text on hover.

90. What is `data-*`?

A: Custom data attributes.

<div data-user="123"></div>

91. What is local storage?

A: Stores data with no expiration.

92. What is session storage?

A: Stores data for one session.

93. Difference localStorage vs sessionStorage?

localStorage: persists after closing browser.
sessionStorage: cleared on tab close.

94. What is Geolocation API?

A: Gets user’s location via JavaScript.

95. What are Web Workers?

A: Run scripts in background threads.

96. What is Drag and Drop API?

A: Native support for draggable interfaces.

97. What is the History API?

A: Manipulate browser session history.

98. What are WebSockets?

A: Bi-directional communication.

99. How to defer image loading?

<img src="image.jpg" loading="lazy">

100. How to optimize for SEO?

Use semantic tags.
Use alt text.
Proper heading structure.
Meta description.

HTML Elements & Attributes (Extended)

101. Can you nest a `<p>` tag inside another `<p>`?

A: No, <p> cannot contain other block elements including another <p>.

102. What does the lang attribute on `<html>` do?

A: Specifies the language of the page (useful for screen readers & SEO).

<html lang="en">

103. How can you make text appear preformatted (preserve spaces)?

A: Using <pre> tag.

104. What does the dir attribute do?

A: Sets text direction (ltr or rtl).

<p dir="rtl">مرحبا</p>

105. What does `translate="no"` do?

A: Hints to translation tools not to translate this element.

106. What is the contenteditable attribute?

A: Makes an element’s content editable in browser.

<div contenteditable="true">Edit me</div>

107. What is the spellcheck attribute?

A: Enables or disables spellchecking.

108. What is the hidden attribute?

A: Hides the element from rendering.

109. What does the `<mark>` tag do?

A: Highlights text.

<p>Learn <mark>HTML</mark> quickly!</p>

110. What is the `<small>` tag used for?

A: Renders smaller text, often for disclaimers.

111. What is the `<abbr>` tag?

A: Indicates abbreviation or acronym.

<abbr title="World Health Organization">WHO</abbr>

112. What does `<time>` represent?

A: Defines a date/time.

<time datetime="2025-07-16">July 16, 2025</time>

113. What is `<cite>` used for?

A: Reference to a creative work.

<cite>Romeo & Juliet</cite>

114. What does `<address>` do?

A: For contact information.

115. What does `<dfn>` represent?

A: The defining instance of a term.

116. What does `<kbd>` mean?

A: Indicates user input (like keyboard input).

117. What does `<samp>` mean?

A: Sample output from a computer program.

118. What does `<var>` tag do?

A: Represents a variable.

119. What is `<bdi>`?

A: Isolates part of text to override its bidirectional directionality.

120. What is `<bdo>`?

A: Overrides text direction.

<bdo dir="rtl">Hello</bdo>

121. What is the tabindex attribute?

A: Controls tab order of elements.

122. What does accesskey do?

A: Defines keyboard shortcut to activate/focus an element.

123. What does draggable do?

A: Makes elements draggable.

124. What is the aria- family of attributes for?

A: ARIA (Accessible Rich Internet Applications) improves accessibility for assistive technologies.

125. What does role attribute do?

A: Defines the role of an element (like role="button").

126. How do you create a progress bar in HTML?

<progress value="70" max="100"></progress>

127. How to use `<meter>`?

<meter value="2" min="0" max="10">2 out of 10</meter>

128. What is the `<details>` tag?

A: Creates a disclosure widget.

<details><summary>More info</summary>Hidden content</details>

129. What is `<summary>` used for?

A: Summary of <details>, always visible.

130. What is `<dialog>` used for?

A: Native modal dialogs.

131. What is autocomplete on `<form>` or `<input>`?

A: Tells browser if it should autofill fields.

132. What is the novalidate attribute?

A: Skips form validation on submit.

133. What is the autofocus attribute?

A: Puts focus on input when page loads.

134. What is readonly?

A: Makes input not editable but submits value.

135. What is disabled?

A: Makes input uneditable and excluded from submission.

136. What does required do?

A: Marks input mandatory.

137. What is min and max?

A: For number, date inputs to restrict values.

138. What does step do?

A: Specifies increment steps.

<input type="number" step="5">

139. What is placeholder?

A: Gives a hint inside input box.

140. What is multiple for `<input type="file">`?

A: Allows multiple file selection.

141. How do you disable resizing of `<textarea>`?

<textarea style="resize:none;"></textarea>

142. How to make `<input>` accept only images?

<input type="file" accept="image/*">

143. How to specify maximum length?

<input maxlength="10">

144. What is formnovalidate on a submit button?

A: Bypasses validation when clicked.

145. What is formenctype?

A: Specifies encoding type for form data (like multipart/form-data).

146. What is formmethod?

A: Overrides <form>’s method.

147. What is formaction?

A: Overrides <form>’s action for that button.

148. What is list attribute for `<input>`?

A: Links to <datalist> for autocomplete options.

149. How to make a search field?

<input type="search">

150. How to make a password field?

<input type="password">

151. What is the `<colgroup>` tag?

A: Groups columns for styling.

152. What is the `<col>` tag?

A: Defines column properties inside <colgroup>.

153. How to add scope to `<th>`?

<th scope="col">Header</th>

154. What does headers attribute do in `<td>`?

A: Associates data cell with header cells.

155. How to add summary to a table for accessibility?

A: Using aria-describedby or explaining with surrounding text. No native summary attribute in HTML5.

156. What does `<source>` tag do?

A: Provides multiple media sources.

<video controls>
  <source src="movie.mp4" type="video/mp4">
</video>

157. What does `<track>` do?

A: Adds subtitles/captions.

<track kind="subtitles" src="sub.vtt">

158. What is poster on `<video>`?

A: Specifies an image to show before the video plays.

159. How to loop audio/video?

<video loop></video>

160. How to autoplay audio/video?

<video autoplay muted></video>

(Note: muted required for autoplay to work in most browsers.)

161. What is `<object>` tag?

A: Embeds external resources like PDF or Flash (older practice).

162. What is `<embed>` tag?

A: Embeds external content (like plugin content).

163. Difference between `<embed>` and `<object>`?

<embed> is self-contained.
<object> can have fallback content.

164. How to embed Google Maps?

A: Using an <iframe> with embed code from Google.

165. What is aria-label?

A: Gives an accessible label to screen readers.

166. What is aria-hidden?

A: Hides element from assistive tech.

167. What is aria-live?

A: Tells screen readers to announce changes.

168. How to label an icon-only button?

<button aria-label="Close">
  <svg>...</svg>
</button>

169. What is aria-expanded?

A: Indicates expandable state (like dropdowns).

170. What is aria-controls?

A: Identifies the element a widget controls.

171. What is defer vs async script loading difference?

defer: waits for HTML parsing, preserves order.
async: loads immediately, order not guaranteed.

172. What does `rel="noopener noreferrer"` on links do?

A: Improves security when opening links in new tabs.

173. What is preload in `<link>`?

A: Instructs browser to load resource early.

<link rel="preload" href="style.css" as="style">

174. What is prefetch?

A: Loads resources for likely future navigation.

175. What is dns-prefetch?

A: Resolves domain names early.

176. How to make a favicon?

<link rel="icon" href="favicon.ico" type="image/x-icon">

177. How to add an app manifest?

<link rel="manifest" href="manifest.json">

178. What does canonical tag do?

A: Indicates preferred URL to search engines.

<link rel="canonical" href="https://site.com/page">

179. How to link an alternate language page?

<link rel="alternate" hreflang="fr" href="https://site.com/fr">

180. How to preload fonts?

<link rel="preload" href="font.woff2" as="font" type="font/woff2" crossorigin>

181. What is hreflang used for?

A: Indicates language & region of page content for search engines.

182. What does nofollow do in a link?

A: Tells search engines not to follow the link.

<a href="..." rel="nofollow">Link</a>

183. How to prevent indexing of a page?

<meta name="robots" content="noindex, nofollow">

184. What is robots.txt?

A: A file that tells search bots which pages to crawl or avoid.

185. What is the viewport meta tag for?

A: Controls how page scales on different devices.

186. Why is semantic HTML important for SEO?

A: Helps search engines understand page structure.

187. What is lazy loading?

A: Deferring loading images/videos until needed.

<img src="..." loading="lazy">

188. How to embed CSS inside HTML?

<style>
  p { color: blue; }
</style>

189. How to use inline CSS?

<p style="color:red;">Hello</p>

190. How to import external CSS?

<link rel="stylesheet" href="styles.css">

191. Can `<style>` be in `<body>`?

A: Valid but discouraged; best placed in <head>.

192. What is scoped attribute on `<style>`?

A: Was proposed to scope styles to its parent element but not widely supported.

193. How to run inline JavaScript?

<script>alert("Hi")</script>

194. How to call a function on button click?

<button onclick="sayHi()">Click</button>

195. How to load JS from a file?

<script src="app.js"></script>

196. Should scripts be at bottom or top?

A: Bottom of <body> for faster page load (unless using defer or async).

197. How to prevent script execution if JS disabled?

<noscript>Enable JavaScript to see content</noscript>

198. What is `dir="auto"`?

A: Lets browser guess direction (ltr or rtl).

199. How to provide alternative language versions?

<link rel="alternate" hreflang="es" href="...">

200. What does aria-labelledby do?

A: Points to element whose text labels this one.

201. How to make sure form controls are accessible?

A: Always use <label for="id">.

202. What does aria-describedby do?

A: Points to element providing description.

203. How to indicate toggle state?

<button aria-expanded="false">Menu</button>

204. What does `<link rel="manifest">` do?

A: Links to web app manifest for PWA.

205. What is theme-color meta tag?

<meta name="theme-color" content="#4285f4">

Controls browser UI color.

206. How to specify icons for devices?

<link rel="apple-touch-icon" href="icon.png">

207. What is a service worker?

A: A script that runs in background for caching/offline.

208. What is the File API?

A: Reads file data from <input type="file">.

209. What is Web Storage API?

A: localStorage and sessionStorage for client-side storage.

210. What is the Web Notifications API?

A: Shows system notifications from the browser.

211. What is the Clipboard API?

A: Lets you read/write clipboard text.

212. What is the Fullscreen API?

A: Makes elements take up entire screen.

213. What is WebRTC?

A: Enables real-time peer-to-peer communication.

214. What is `user-scalable=no` in viewport?

<meta name="viewport" content="width=device-width, user-scalable=no">

Prevents zoom.

215. What is `viewport-fit=cover`?

A: Helps display on devices with notches.

216. What is `apple-mobile-web-app-capable`?

<meta name="apple-mobile-web-app-capable" content="yes">

Launch site in standalone mode on iOS.

217. What is sandbox on `<iframe>`?

A: Applies extra restrictions (like blocking scripts).

<iframe sandbox src="..."></iframe>

218. What does allowfullscreen do?

A: Lets iframe content go fullscreen.

219. What is srcdoc in `<iframe>`?

A: Inline HTML content inside iframe.

220. What is `loading="lazy"` on `<iframe>`?

A: Delays loading until in viewport.

221. What does `data-*` do?

A: Stores custom data for JavaScript.

<div data-user-id="123"></div>

222. Can `data-*` be styled by CSS?

A: Yes, via attribute selectors.

223. What is `<picture>` tag for?

A: For responsive images.

<picture>
  <source media="(min-width: 600px)" srcset="large.jpg">
  <img src="small.jpg" alt="">
</picture>

224. What is srcset on `<img>`?

A: Lists multiple images for different resolutions.

225. What is sizes attribute?

A: Informs browser how much space image will use, for better resource choice.

226. What is `<output>` tag for?

A: Displays calculation results.

<output>42</output>

227. What is `<template>` tag?

A: Holds HTML that isn’t rendered but can be cloned via JavaScript.

What is <slot>? A: Used in Web Components for placeholder content.

229. What is `<shadow>`?

A: Deprecated shadow DOM element, replaced by JS APIs.

230. How to provide fallback for `<video>`?

<video controls>
  <source src="video.mp4">
  Your browser does not support video.
</video>

231. How to handle unsupported HTML features?

A: Use polyfills or provide alternative content.

232. What is `rel="noopener"` important for?

A: Prevents the opened page from controlling the opener’s window object.

233. Why avoid inline JavaScript?

A: More prone to XSS attacks.

234. What is CSP (Content Security Policy)?

A: HTTP header to control resources browser is allowed to load.

235. What is HTML “quirks mode”?

A: Browser mode triggered by missing <!DOCTYPE html> causing non-standard rendering.

236. What does “strict mode” in HTML mean?

A: Using correct <!DOCTYPE html> ensures standards mode.

237. Is HTML case sensitive?

A: No, tags and attributes are case-insensitive.

238. Can you omit closing tags?

A: For some elements like <li>, <p>, <td>, browsers auto-close them.

239. What does meta `http-equiv="X-UA-Compatible"` do?

A: Forces IE to use latest rendering engine.

240. How to write conditional comments for IE?

<!--[if IE]>
<p>You are using Internet Explorer.</p>
<![endif]-->

(Deprecated, but historic.)

241. What is feature detection?

A: Using JS or CSS to check if a browser supports a feature before using it.

242. How can Modernizr help?

A: JS library that detects HTML5/CSS3 features.

243. How to make a slider input?

<input type="range" min="0" max="100">

244. How to make input for month?

<input type="month">

245. How to make input for week?

<input type="week">

246. How to make input for time?

<input type="time">

247. How to enforce numeric input?

<input type="number">

248. How to add search clear button on mobile?

Use type="search" which often triggers native clear UI.

249. How to provide fallback fonts?

<p style="font-family: 'CustomFont', Arial, sans-serif;">Text</p>

250. What is “graceful degradation” in HTML?

A: Building with advanced features but ensuring content still works without them.

How to specify input pattern for 5 digit zip code?

<input pattern="\d{5}">

252. What is autocapitalize attribute?

A: Suggests capitalization to mobile keyboards.

253. What does inputmode attribute do?

A: Hints to device on keyboard type.

<input inputmode="numeric">

254. What is nomodule in `<script>`?

A: Tells browser to ignore script if it supports ES modules.

255. What is `<noscript>` typically used for?

A: Content shown if JS is disabled.

256. How to embed Google Fonts?

<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">

257. What is the integrity attribute?

A: Ensures CDN files haven’t been tampered.

<script src="..." integrity="sha384-..." crossorigin="anonymous"></script>

258. What is crossorigin attribute?

A: Controls CORS requests for images/scripts.

259. What is manifest attribute on `<html>`?

A: Used with old AppCache spec (now deprecated).

260. What is the title attribute on `<link>`?

A: Used for alternate stylesheets.

261. What is Microdata in HTML?

A: A way to embed machine-readable data using attributes like itemscope, itemtype, itemprop.

262. How to mark up a person using Microdata?

<div itemscope itemtype="https://schema.org/Person">
  <span itemprop="name">John Doe</span>
</div>

263. What is JSON-LD?

A: A way to include linked data (structured data) in a JSON script for SEO, often for rich results.

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Organization",
  "name": "Example"
}
</script>

264. Difference between Microdata and JSON-LD?

Microdata: embedded in HTML tags.
JSON-LD: separate <script>, cleaner, recommended by Google.

265. What is AMP HTML?

A: A streamlined form of HTML for faster mobile pages.

266. How to declare an AMP page?

<!doctype html>
<html amp>
<head>
  <script async src="https://cdn.ampproject.org/v0.js"></script>
</head>
</html>

267. Why use AMP?

A: Improves loading speed and can increase visibility on Google.

268. What is `amp-img`?

A: AMP’s replacement for <img>, requires explicit width & height.

269. What does lang attribute help with beyond screen readers?

A: Helps browsers pick correct hyphenation, fonts, and text-to-speech.

270. What is translate attribute?

A: Tells Google Translate or similar whether to translate content.

271. What is `aria-busy`?

A: Indicates an element is updating, prevents announcements until finished.

272. What does meta `name="format-detection"` do?

A: Controls auto-detection of phone numbers on iOS.

273. What does meta `name="referrer"` do?

A: Controls Referer HTTP header.

<meta name="referrer" content="no-referrer">

274. What is meta `http-equiv="refresh"`?

A: Redirects after a delay.

<meta http-equiv="refresh" content="3;url=page.html">

275. What is meta `property="og:title"`?

A: Part of Open Graph for social sharing previews.

276. What is type="module" in `<script>`?

A: Uses ES6 modules, allowing import & export.

<script type="module" src="app.js"></script>

277. What is nomodule for?

A: Loads legacy script if browser doesn't support modules.

278. Can you put async on `type="module"`?

A: Modules are deferred by default. async changes to run ASAP, not recommended.

279. How to provide print styles?

<link rel="stylesheet" media="print" href="print.css">

280. How to ensure links look good when printed?

Use CSS like:

a::after { content: " (" attr(href) ")"; }

281. How to add closed captions to video?

<track kind="captions" src="captions.vtt" srclang="en" label="English">

282. What is `<wbr>` tag?

A: Suggests a line break opportunity.

pneumo<wbr>ultra<wbr>microscopic

283. What does `<ruby>` do?

A: Annotation for East Asian typography.

<ruby>漢<rt>kan</rt></ruby>

284. What is `<rt>`?

A: Gives pronunciation inside <ruby>.

285. What is `<rp>`?

A: Fallback text for browsers that don't support <ruby>.

A: Intended for context menus or toolbars (rarely used today).

287. What is `<menuitem>`?

A: Proposed for interactive menu items, mostly unsupported.

288. What does `<!—` vs `<!--` signify?

A: <!— is invalid, needs to be <!-- for comments.

289. Can you use emoji in HTML content?

A: Yes, natively supported.

<p>😀 HTML is fun!</p>

290. What does `<noscript>` do inside `<head>`?

A: Can provide fallback CSS for users with JS disabled.

291. How to dynamically add HTML with JS?

document.body.innerHTML += "<p>Added!</p>";

292. What is `innerHTML` vs `textContent`?

innerHTML: parses HTML tags.
textContent: inserts plain text.

293. How to prevent XSS with dynamic content?

A: Sanitize input, avoid innerHTML when possible.

294. What does ondragstart do?

A: Handles start of a drag operation.

295. What is dataTransfer?

A: JS object to hold drag data during drag-and-drop.

296. What is aria-checked?

A: State of checkboxes or menu items.

<div role="checkbox" aria-checked="true"></div>

297. What is aria-selected?

A: Marks selected elements in a list/grid.

298. What is aria-haspopup?

A: Indicates an element opens a popup.

299. What is aria-pressed?

A: Indicates toggle button state.

300. How to ensure good tab order?

A: Use tabindex, logical DOM order, and avoid removing focusable elements.