HTML 5 Elements

HTML 5 Elements

• <header>
• <nav>
• <section>
• <article>
• <aside>
• <footer>
• <figure>
• <details> 
• <main>
• <time>

The <header> element defines a header of your document. It is always visible for the users at the top of the page:

<header>
	<h1>JavaScript</h1>
	<h3>What is JavaScript?</h3>
	<p>Today we are going to talk about JavaScript</p>
</header>

The <nav> depicts the space for navigation links on your website:

<nav>
	<ul>
		<li><a href="https://programmingtrick.com/digital-marketing-course-in-allahabad">
Digital Marketing</a></li>
		<li><a href="https://programmingtrick.com/certificate-course-on-python-course-in-allahabad">
Python</a></li>
		<li><a href="https://programmingtrick.com/ccc-course-in-allahabad">
Course on Computer Concept</a></li>
		<li><a href="hhttps://programmingtrick.com/certificate-course-in-core-java-course-in-allahabad">
Java</a></li>
	</ul>
</nav>

The <section> tags are used to define a separate section within a webpage, with its own content:

<section>
	<h1>Section Heading</h1>
	<p>The section tag can contain any elements.</p>
	<img src="image.png" alt="section example">
</section>

The <article> element can be used to define the article content on your website:

<article>
	<h1>Fun Fact</h1>
	<p>Fun fact: most of the fun facts on the Internet are not actually fun.</p>
</article>

The <aside> semantic element defines the content which will be set to the side. It is occasionally used for creating sidebars, but can also be used for displaying less important content:

<aside>
  <h4>Lake</h4>
  <p>Oxford lake is a lake in the state.</p>
</aside>

The <footer> element describes the footnote for your website or part of the content:

<footer>
	<address>
		Postal Address: G. R. Complex Preetam Nagar.
	</address>
	<p>Copyright © 2018 All rights reserved.</p>
</footer>

The <figure> element depicts space for separated content, such as photos, diagrams, etc. To provide a caption for this element, use the <figcaption> tags:

<figure>
	<figcaption>Dog</figcaption>
	<img src="image.png" alt="The Bread Dog" width="300" height="300">
</figure>

The <details> element defines the details on your website that can either be visible or hidden. To add a summary for this element, use the <summary> element:

<details> 
	<summary>Some details</summary> 
	<p>Provide more info about the details here.</p>
</details>

The content of the <main> tags is the main content of a page. It can be an article, regular paragraph or anything else:

<main id="content" class="group" role="main">

The <mark> element highlights the text to emphasize its meaning:

<p>The mark tag is <mark>useful</mark> when you need to highlight important information</p>

The <time> element is used to define and display time and date on your web page:

<h2>The premiere show starts at <time>21:00</time> today.</h2>