Create an HTML document with the appropriate document structure, including the <!DOCTYPE>
, <html>
, <head>
, and <body>
elements.
Design a webpage that uses semantic HTML elements like <header>
, <nav>
, <main>
, <article>
, <section>
, <aside>
, and <footer
to structure the content.
Build a webpage with headings (h1 to h6) to structure the content into sections. Use <hgroup>
to group headings when necessary.
Practice using attributes in HTML. Create a form with various input types and attributes like required
, placeholder
, and pattern
.
Develop a webpage that includes different types of links, such as links to external websites, internal links to sections on the same page, email links, and download links.
Create a webpage with both ordered and unordered lists. Nest lists within each other and use list item attributes like start
and value
.
Design a complex HTML table with rows and columns. Include merged cells, header cells, and different data types in the cells.
Build a multi-page HTML form that includes text inputs, radio buttons, checkboxes, dropdown menus, and text areas.
Practice adding images to your HTML pages. Experiment with image attributes like alt
, width
, and height
.
Include both audio and video elements in a webpage, sourcing media from different locations (local files and online sources).
Create a webpage with templates and shadow DOM, using the <template>
, <slot>
, and shadow DOM features.
Implement an HTML API such as the Geolocation API, Web Storage API, or Drag and Drop API within your webpage.
Ensure your HTML is accessible by correctly using the tabindex
attribute for keyboard navigation.
Incorporate less common inline text elements like <mark>
, <code>
, and <kbd>
into your webpage.
Create a page with <details>
and <summary>
elements to hide and reveal additional content.
Use the HTML <dialog>
element to create a modal dialog box in your webpage.
By completing these assignments, you will gain a deep understanding of various HTML elements and their usage, making you an advanced-level HTML user.