0% found this document useful (0 votes)
8 views2 pages

HTML Practice Sheet for Beginners

The document is a practical HTML practice sheet divided into ten modules covering various aspects of HTML, including basic structure, text formatting, lists, links, images, tables, forms, semantic HTML5, media embedding, and mini projects. Each module outlines specific tasks and examples to enhance HTML skills. An optional challenge is included to recreate the homepage of a popular site using only HTML.

Uploaded by

ismattari99
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
8 views2 pages

HTML Practice Sheet for Beginners

The document is a practical HTML practice sheet divided into ten modules covering various aspects of HTML, including basic structure, text formatting, lists, links, images, tables, forms, semantic HTML5, media embedding, and mini projects. Each module outlines specific tasks and examples to enhance HTML skills. An optional challenge is included to recreate the homepage of a popular site using only HTML.

Uploaded by

ismattari99
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

HTML Practical Practice Sheet

Module 1: Basic Structure & Tags

- Create a basic HTML boilerplate.


- Use <title>, <h1> to <h6>, <p>, <br>, <hr> tags.
- Create a webpage with headings, paragraphs, and horizontal rules.

Module 2: Text Formatting Tags

- Use tags like <b>, <i>, <u>, <strong>, <em>, <mark>, <small>, <sub>, <sup>.
- Display a paragraph using at least 5 formatting tags.

Module 3: Lists

- Create an unordered list of fruits.


- Create an ordered list of your daily routine.
- Create a nested list (list inside list).
- Combine unordered and ordered lists to display a restaurant menu.

Module 4: Links and Anchors

- Add internal links to sections on the same page.


- Add external links to Google, YouTube.
- Add a downloadable link to a PDF/image.
- Add email and phone links.

Module 5: Images

- Insert an image with width, height, alt attributes.


- Link on the image.
- Caption using <figure> and <figcaption>.

Module 6: Tables

- Create a table showing student marks with <thead>, <tbody>, <tfoot>.


- Use of rowspan and colspan.
- Style the table using inline CSS.
Module 7: Forms

- Create a login form with username and password.


- Create a registration form with Name, Email, Phone, Gender, Hobbies, Country, File upload, and
Submit button.
- Use label and fieldset.

Module 8: Semantic HTML5

- Create a page layout using <header>, <nav>, <main>, <section>, <article>, <aside>, <footer>.

Module 9: Media Embedding

- Embed an audio file with controls.


- Embed a video file with controls.
- Embed a YouTube video using <iframe>.

Module 10: Mini HTML Projects

- Project 1: Personal Portfolio Page


- Project 2: Restaurant Menu Page
- Project 3: Feedback Form

Optional Challenge: Code Recreate

- Recreate the basic structure of a popular site homepage (like Wikipedia or Amazon) using only
HTML.

You might also like