HTML Challenges

Master HTML by solving 50 hands-on problems.

The First Heading

Create a level-one heading (h1) with the text 'My First Website'.

Easy

Paragraph Power

Create a paragraph (p) with the text 'HTML is fun!'.

Easy

Bold Statement

Make the word 'Important' bold using the strong tag.

Easy

Clickable Link

Create a link to 'https://google.com' with the text 'Search'.

Easy

Image Insertion

Insert an image with src 'cat.jpg' and alt text 'A cute cat'.

Easy

Unordered List

Create an unordered list (ul) with three items: 'Apple', 'Banana', 'Cherry'.

Easy

Input Field

Create a text input field with a placeholder 'Enter your name'.

Easy

Line Break

Add a line break (br) between 'Hello' and 'World'.

Easy

Horizontal Rule

Add a horizontal rule (hr) to separate content.

Easy

Button Click

Create a button with the text 'Submit'.

Easy

Italic Text

Make the word 'Fancy' italic using the i tag.

Easy

Underlined Text

Underline the word 'Underlined' using the u tag.

Easy

Small Text

Make the copyright text small using the small tag.

Easy

Ordered List

Create an ordered list (ol) with two items: 'First', 'Second'.

Easy

Password Input

Create a password input field.

Easy

Radio Button

Create a radio button with name 'gender' and value 'male'.

Easy

Main Content

Wrap the content in a main tag.

Easy

Article Tag

Create an article tag with a heading 'News'.

Easy

Section Tag

Create a section tag.

Easy

Audio Player

Create an audio tag with controls.

Easy

Simple Table

Create a table with one row containing two headers: 'Name' and 'Age'.

Medium

Form Submission

Create a form that submits to '/login' using the POST method.

Medium

Div Container

Create a div with the class 'container' containing a paragraph 'Inside div'.

Medium

Internal Link

Create an anchor link that jumps to the element with id 'footer'. Text should be 'Go to Bottom'.

Medium

Checkbox Input

Create a checkbox input with the id 'agree' and a label 'I agree' associated with it.

Medium

Table Row

Create a table row (tr) with two data cells (td) containing 'A' and 'B'.

Medium

Textarea

Create a textarea with 4 rows and 50 columns.

Medium

Labelled Input

Create a label for 'email' and an input with id 'email'.

Medium

New Tab Link

Create a link to 'https://example.com' that opens in a new tab.

Medium

Mailto Link

Create a link to send an email to 'info@example.com'.

Medium

Picture Tag

Create a picture tag with an img tag inside.

Medium

Details Widget

Create a details tag with a summary 'More Info'.

Medium

Aside Content

Create an aside tag with a paragraph 'Sidebar'.

Medium

Navigation

Create a nav tag with a link 'Home'.

Medium

Definition List

Create a definition list (dl) with one term (dt) and description (dd).

Medium

Complex Table

Create a table where the first cell spans 2 columns (colspan). Row 1: 'Header' (spans 2). Row 2: 'A', 'B'.

Hard

Semantic Layout

Structure a page using semantic tags: header, nav, main, footer.

Hard

Video Embed

Embed a video 'movie.mp4' with controls and width 320.

Hard

Select Dropdown

Create a dropdown (select) with name 'cars' and options 'Volvo', 'Saab'. 'Volvo' should be selected by default.

Hard

Meta Tags

Add a meta tag for viewport settings to make the page responsive.

Hard

Datalist

Create an input linked to a datalist with id 'browsers'.

Hard

Optgroup

Create a select with an optgroup labeled 'Cars'.

Hard

Fieldset Legend

Group form data with a fieldset and a legend 'Personal Info'.

Hard

Table Structure

Create a table with thead, tbody, and tfoot.

Hard

Table Caption

Add a caption 'Monthly Savings' to a table.

Hard

Charset Meta

Define the character set as UTF-8.

Hard

Description Meta

Add a meta description 'Free Web Tutorials'.

Hard

Dialog Modal

Create an open dialog tag with text 'Hello'.

Hard

Class Attribute

Create a p tag with class 'intro'.

Hard

ID Attribute

Create a h1 tag with id 'main-title'.

Hard
HTMLViz
© 2026 HTMLViz. Open Source Learning.