Intermediate Level
Q11. Create a link opening in new tab.
<a href="https://google.com" target="_blank">Google</a>
Q12. Create a table.
<table border="1">
<tr><th>Name</th><th>Age</th></tr>
<tr><td>Vijay</td><td>25</td></tr>
</table>
Q13. Create a login form.
<form>
<input type="text" placeholder="Username">
<input type="password" placeholder="Password">
<input type="submit">
</form>
Q14. Add radio buttons.
<input type="radio" name="g">Male
<input type="radio" name="g">Female
Q15. Add checkboxes.
<input type="checkbox">HTML
<input type="checkbox">CSS
Q16. Create dropdown.
<select>
<option>India</option>
<option>USA</option>
</select>
Q17. Use fieldset and legend.
<fieldset>
<legend>Details</legend>
</fieldset>
Q18. Add iframe.
<iframe src="page.html"></iframe>
Q19. Create email validation.
<input type="email" required>
Q20. Add placeholder text.
<input type="text" placeholder="Enter name">
Advanced Level
Q21. Create semantic layout.
<header>Header</header>
<nav>Menu</nav>
<section>
<article>Content</article>
</section>
<footer>Footer</footer>
Q22. Use main tag.
<main>Main Content</main>
Q23. Create readonly input.
<input type="text" value="Read only" readonly>
Q24. Create disabled input.
<input type="text" value="Disabled" disabled>
Q25. Add contenteditable.
<p contenteditable="true">Edit me</p>
Q26. Use data attribute.
<div data-id="101">User</div>
Q27. Embed audio.
<audio controls>
<source src="song.mp3">
</audio>
Q28. Embed video.
<video controls width="300">
<source src="video.mp4">
</video>
Q29. Create download link.
<a href="file.pdf" download>Download</a>
Q30. Use details & summary.
<details>
<summary>More</summary>
Content
</details>
Q31. Create figure with caption.
<figure>
<img src="img.jpg">
<figcaption>Image</figcaption>
</figure>
Q32. Add meta viewport.
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Q33. Use noscript.
<noscript>Enable JS</noscript>
Q34. Create textarea.
<textarea rows="4"></textarea>
Q35. Create form with required field.
<input type="text" required>
Q36. Use hidden attribute.
<p hidden>Hidden text</p>
Q37. Create telephone input.
<input type="tel">
Q38. Create number input.
<input type="number">
Q39. Create date picker.
<input type="date">
Q40. Create time input.
<input type="time">
Q41. Use progress bar.
<progress value="50" max="100"></progress>
Q42. Use meter tag.
<meter value="0.6"></meter>
Q43. Add address tag.
<address>India</address>
Q44. Create marquee alternative (CSS-free).
<marquee>Scrolling Text</marquee>
Q45. Use small tag.
<small>Small text</small>
Q46. Use sup and sub.
H<sub>2</sub>O
x<sup>2</sup>
Q47. Create blockquote.
<blockquote>Quote</blockquote>
Q48. Use mark tag.
<mark>Highlighted</mark>
Q49. Create definition list.
<dl>
<dt>HTML</dt>
<dd>Markup Language</dd>
</dl>
Q50. Create favicon link.
<link rel="icon" href="favicon.ico">
HTML Coding Questions & Answers
Q51. Create a password input with minimum length 6.
<input type="password" minlength="6">
Q52. Create a search input field.
<input type="search" placeholder="Search...">
Q53. Create a color picker.
<input type="color">
Q54. Create a range slider.
<input type="range" min="0" max="100">
Q55. Create a month picker.
<input type="month">
Q56. Create a week picker.
<input type="week">
Q57. Create a file upload input.
<input type="file">
Q58. Restrict file upload to images only.
<input type="file" accept="image/*">
Q59. Create multiple file upload.
<input type="file" multiple>
Q60. Create a form submit button using button tag.
<button type="submit">Submit</button>
Q61. Create a reset button.
<input type="reset">
Q62. Create a hidden input field.
<input type="hidden" value="123">
Q63. Create an input with autofocus.
<input type="text" autofocus>
Q64. Disable autocomplete in a form.
<form autocomplete="off">
</form>
Q65. Create a required checkbox.
<input type="checkbox" required> Accept Terms
Q66. Create an email input with pattern validation.
<input type="email" pattern=".+@.+\.com">
Q67. Create an input with max and min values.
<input type="number" min="1" max="10">
Q68. Create a text area with character limit.
<textarea maxlength="100"></textarea>
Q69. Create a label linked to input.
<label for="name">Name</label>
<input id="name">
Q70. Create a clickable phone number.
<a href="tel:9876543210">Call Now</a>
Q71. Create a clickable email address.
<a href="mailto:test@example.com">Email</a>
Q72. Create an ordered list starting from 5.
<ol start="5">
<li>Item</li>
</ol>
Q73. Reverse an ordered list.
<ol reversed>
<li>One</li>
</ol>
Q74. Create a navigation menu.
<nav>
<a href="#">Home</a>
<a href="#">About</a>
</nav>
Q75. Create a responsive image.
<img src="img.jpg" style="max-width:100%;">
Q76. Use picture tag for responsive images.
<picture>
<source media="(max-width:600px)" srcset="small.jpg">
<img src="large.jpg">
</picture>
Q77. Create a collapsible FAQ using details tag.
<details>
<summary>Question</summary>
Answer
</details>
Q78. Create a progress bar showing 70%.
<progress value="70" max="100"></progress>
Q79. Create a meter showing low value.
<meter min="0" max="100" value="20"></meter>
Q80. Create a time element.
<time datetime="2025-01-01">Jan 1, 2025</time>
Q81. Create an abbreviation with tooltip.
<abbr title="HyperText Markup Language">HTML</abbr>
Q82. Create keyboard input text.
<kbd>Ctrl + S</kbd>
Q83. Create sample output text.
<samp>Output</samp>
Q84. Display code snippet.
<code>console.log("Hello")</code>
Q85. Create preformatted text.
<pre>
Line 1
Line 2
</pre>
Q86. Use aside tag.
<aside>Sidebar content</aside>
Q87. Create header with logo text.
<header>
<h1>MySite</h1>
</header>
Q88. Create footer with copyright.
<footer>© 2025 MySite</footer>
Q89. Create a section with article.
<section>
<article>Post</article>
</section>
Q90. Create a simple HTML5 page structure.
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"></head>
<body>Content</body>
</html>
Q91. Create meta description.
<meta name="description" content="HTML Practice">
Q92. Disable right click (HTML attribute).
<body oncontextmenu="return false">
Q93. Add language attribute.
<html lang="en">
Q94. Create favicon.
<link rel="icon" href="favicon.ico">
Q95. Create text direction right-to-left.
<p dir="rtl">Text</p>
Q96. Create ordered list with Roman numbers.
<ol type="I">
<li>One</li>
</ol>
Q97. Create unordered list with square bullets.
<ul type="square">
<li>Item</li>
</ul>
Q98. Create download link for image.
<a href="img.jpg" download>Download Image</a>
Q99. Create a noscript message.
<noscript>JavaScript is disabled</noscript>
Q100. Create a complete semantic page layout.
<header>Header</header>
<nav>Menu</nav>
<main>
<section>
<article>Content</article>
</section>
</main>
<footer>Footer</footer>
No comments:
Post a Comment