2.Hands-on_HTML
2.Hands-on_HTML
Practices# :2
Topic : HTML
Requirements:
• Use semantic HTML elements like <header>, <section>, and <footer>.
• Include headings, paragraphs, and lists where appropriate.
Requirements:
• Use <article> for the blog post and <aside> for the sidebar.
• Include elements like <h1>, <h2>, <p>, and <ul>.
3. Design a product landing page for a new electronic gadget. The page should include:
• A large image of the product at the top.
• A section with a product description and its key features (use a list).
• A pricing section with different pricing options (use a table).
• A call-to-action button like "Buy Now" at the bottom.
Requirements:
• Use semantic HTML elements such as <section>, <table>, and <button>.
• Make sure the table includes rows and columns for different pricing tiers.
Requirements:
• Use <header>, <section>, and <footer> for structure.
• Use <ul> and <li> for menu items and <strong> to highlight the prices.
5. Design a simple photo gallery webpage for a photography portfolio. The page should
include:
• A header with the photographer’s name.
• A grid of images, each representing a photo in the portfolio (you can use
placeholder images).
• Below each image, there should be a title or short photo description.
Requirements:
• Use <img> tags for the photos and organize them using <div> or <section>.
• Provide text descriptions or titles for each photo using <figcaption> or <p>.