Showing posts with label HTML ELEMENT. Show all posts
Showing posts with label HTML ELEMENT. Show all posts

Monday, November 7, 2022

Html Element Tag

 

 HTML  Element 

HTML 5 Element Tag


1. Section tag

 The HTML <section> element represents a standalone section which doesn't have a more specific semantic element to represent it contained within an HTML, document. The <section> tag defines sections in a document, such as chapters, headers, footers, or any other sections of the document Typically, but not always, sections have a heading


 Section tag program 

<!DOCTYPE html>

<html>

<h2>HTML5 Introduction</h2> <p>HTML5 is the latest development of the standard that defines HTML. <br>

The term represents two different concepts.</p>

</section>

<section>

<h1>Features</h1>

<p> Semantics: allowing you to describe more precisely what your content is.<br> •Connectivity: allowing you to communicate with the server in new  ways.<br>

</p>

</section>

<body>

</html>


  Section tag  Output 

Html section tag use


2) Nav tag

 The <nav> tag is a new element in HTML5. It is used to define a block of navigation links, either within the current document or to other documents. Examples of navigation blocks

are menus, tables of contents, and indexes. One HTML document may contain several <nav> tags, for example, one for site navigation and one for intra-page navigation.Note that not all links in the HTML document can be placed inside the <nav> element; it can only include major navigation blocks. For example, the <nav > tag is not placed in the <footer> tag for defining links in the footer of the website.


Syntax: 

The <nav > tag comes in pairs; the content is written between the opening (<nav> ) and closing (</nav>) tags.


Nav tag program 

<!DOCTYPE html>

 <html>

<head>

<title>Title of the document</title>

</head>

<body>

<header>

<h1>Programming Courses</h1>

</header>

<nav>

<a href="Html.html">HTML</a> | <a href="CSS.html">CSS</a> | <a href="javascript.html">JavaScript</a> | <a href="/php.html">PHP</a>

</nav>

<h2>Welcome to Bhosle Publication</h2>

</body>

</html>


Nav tag output 


Html Nav tag use

3) Article tag

 The <article> tag has been added to HTML5. It is used to define an independent, self contained content. An article should have its own meaning and be easily differentiated from the rest of the web page content.

Article tags are an important way to put readers in touch with helpful content. Each page should normally have several tags to help keep content organized. This article explains the best way to tag pages so that our readers can find information and we can keep the content organized. 

  <article> element can include

Blog entry 

Forum post

News 

Comment


Syntax 

Multiple <article> tags can be used in one HTML document.


Article tag program 

<!DOCTYPE html>

 <html>

<head>

<title>Title of the documente</title>

</head>

<Body>

<article>

<h1>Title of the articles</h1>

<p>Text of the article </p>

</article>

</body>

 </html>


Article tag output 

Html article tah use

4) Aside Tag

 The <aside> tag has been added to HTML5 to define a section with additional information related to the content around the aside element. It is generally used to enhance an article with additional information, or highlighting parts that can be interesting to the user. Content in aside is a stand-alone, non-essential part of the web page, and if you delete it, the main content will not be affected.


Endnotes comments, reference information, lists of terms, a collection of links, pull-quotes, etc. are a kind of information that can appear in the <aside> element. Do not confuse the <aside> element with sidebar. Sidebar is just a visual element, and the <aside> tag doesn't systematically look like a sidebar


Syntax

 The <aside> tag comes in pairs, which means that the content is written between the opening (<aside>) and the closing (</aside>) tags.


Article tag program 

<!DOCTYPE html>

<html>

 <head>

<title>Title of the document</title>

 </head> 

<body>

<aside><h2>Google Chrome</aside>

<P>Google Chrome is a web browser developer by Google, released in 2008. Chrome is the world 's most popular web browser today</p>

</aside>

</body>

</html>

 

Article tag Output

Aside Tag html use

5) Audio Tag

The <audio> has been added to HTML5 to allow embedding audio files to a web page. Since not all browsers support all audio formats, the audio file is encoded using special codecs. The <source> tag or the src attribute is used to indicate the variations of the same audio file. The path to an audio file can contain absolute or relative URLS.


Syntax: The <audio> tag comes in pairs; the content is written between the opening (<audio>) and the closing (</audio>) tags.


Article tag Example 

<html>

Click the play button

 <title>Title of the document</title>

 <head>

 </head>

<body>

<audio controls>

 <source src="/desktop/audio_friendship.mp3" type="audio">

</audio>

<P>click the Play button</p>

</body>

</html>


 Audio Tag  Output 

Audio Tag

6) Video Tag

The HTML 5 <video> tag is used to embed video on an HTML document. Browsers don't all support the same video formats, so you should provide multiple video formats for correct rendering. A path to the video file is nested inside <source> tag, or src attribute. You can also include an alternate text in the <video>tag, that will be displayed in case if the browser doesn't support the video format.


Article tag Example 

 <!DOCTYPE html>

<html>

<head>

 <title>Title of the document</title>

 <style>

 }

width: 300px;

height: 200px

border: 1px solid #666;

video {

</style>

</head>

<body>

<video controls muted   <source src="movie.mp4" type="video/mp4">

  <source src="movie.ogg" type="video/ogg">>

</video>

 <P>Your browser does not support the video tag.</p>

 </body>

 </ html >

Article tag output 


READ MORE