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 


Thursday, November 3, 2022

html frame tag

          Frame Tag

Html frame tag format



1)Creating Vertical Columns 


To create a set of four vertical columns, we need to use the frameset element with the cols attribute The cols attribute is used to define the number and size of columns the frameset will contain. We have four files to display, so we need four frames. To create four frames we need to assign four comma-separated values to the cols attribute.


Creating Vertical Columns 

Example :-

 

<!DOCTYPE html>

<html>

<frameset cols="20%, 30%, 25%, 25%">

<frame src="Firstframe.html"><!--src tag source of your Image location-->

<frame src="Secondframe.html">

<frame src="Thirdframe.html">

<frame src="Fourth Frame.html">

</frameset>

</html>


Creating Vertical Columns 

output :- 


Vertical column  tag use



2)Creating Horizontal  Rows


Rows of frames can be created by using the rows attribute rather than the cols attribute as shown in the HTML. below.


Creating Horizontal Example


<!DOCTYPE html>

<html>

<frameset rows="20%,  20%, 20%, 20%">

<frame src="FirstFrame.html"> 

<frame src="SecondFrame.html">

<frame src="ThirdFrame.html">

<frame src="FourthFrame.html">

</frameset>

</html>


Creating Horizontal  output

 

Horizontal frame tag use







3) Mixing Columns and Rows  


Column and rows of frames can both appear on the same webpage by nesting one frameset inside of another. To do this, we first create a frameset and then nest a child frameset within the paren element. Here's an example of how we could nest two rows within a set of three columns


Mixing Columns and Rows

    Example :-

<!DOCTYPE html>

<html>

<frameset cols="20%, 30%, 25%">

<frameset rows="20%, 30%">

<frame src="Firstframe.html>

<frame src="Secondframe.html>

</frameset>

<frame src= "ThirdFrame.html">

<frame src="Fourth frame.html>

</frameset>

</html>


Mixing Columns and Rows 

  Output 







4) Nested Frames


Frames can even be nested which means, two or more inner frames can be created in one single outer frame.


Nested Frames 

  Example :-

<! Doctype html>

<html>

<frameset rows="20%, 80%">

<frame src="header.html">

<frameset cols="50%,50%">

<frame src="LeftFrame.html">

<frame src="RightFrame.html">

</frameset>

</html>


  Nested Frames  

   Output :-




READ MORE    

Html login form           
html bdo tag     
Html file upload              
CSS box property                                                                                             

Tuesday, November 1, 2022

html Frame Tag

          HTML  Frame TAG 



Frames allows a developer to divide the browser window in such a way that many web-pages can be loaded at the same time and each of which can display a different HTML document. Or we can say that The HTML frameset and frame elements were used to create page layouts in which certain content remained visible while other content was scrol.

HTML Frames are used to divide the web browser window into multiple sections where each section can be loaded separately. A frameset tag is the collection of frames in the browser window.


1)<frameset>

 tag considers the entire browser window as a set of many frames.<frame> tag along with src attribute is used to launch a particular page in a particular frame.

The <frameset> Tag Attributes


2 Columns

 It is basically used to define the number of columns and its size inside the frameset tag. Or we can say that It is used to create vertical frames in web browser. 

 The HTML <frameset> cols Attribute is used to specify the size and the number of columns in a frameset. The width of each frame is separated by a comma. 

For example, to create three vertical frames, use cols="20%,60%,20%


3) Row

It is used to define number of rows and its size inside the frameset tag. Or we can say that it is used to create horizontal frames in web browser. The size or height of the row is set in the frameset in the following ways.

The rows attribute is used to create horizontal frames in web browser. This attribute is used to define no of rows and its size inside the frameset tag.


4) border

It is basically used to define the width of border of each frames in pixels.  

For example, <frameset border="4" frameset>

Example 

<html>
   <body>
      <p style = "border-width:4px; border-style:none;">
         This is a border with none width. </p>
      
      <p style = "border-width:4px; border-style:solid;">
         This is a solid border.</p>
      
      <p style = "border-width:4px; border-style:dashed;">
         This is a dashed border.  </p>
      
      <p style = "border-width:4px; border-style:double;">
         This is a double border.  </p>
      
      <p style = "border-width:4px; border-style:groove;">
         This is a groove border. </p>
      
      <p style = "border-width:4px; border-style:ridge">
         This is a ridge  border. </p>
      
      <p style = "border-width:4px; border-style:inset;">
         This is a inset border.</p>
      
      <p style = "border-width:4px; border-style:outset;">
         This is a outset border.  </p>
      
      <p style = "border-width:4px; border-style:hidden;">
         This is a hidden border. </p>
      
      <p style = "border-width:4px; 
         border-top-style:solid;
         border-bottom-style:dashed;
         border-left-style:groove;
         border-right-style:double;">
         This is a a border with four different styles.
      </p>
   </body>
</html>

Output







5)Frame border

It is used to specify whether the three-dimensional border should be displayed between the Tames or not for these use two values 0 and 1, where 0 defines no border 


6) Frame spacing

It is used to specify the amount of spacing between the frames in a frameset. This can take any integer value as an parameter which basically denotes the value in pix

HTML frameset Tag

Example 

<! Doctype html>

<html>

<frameset rows="1,2" cols="1,2"> 

<frame src="frame_1.html">

 <frame src="frame_2.html">

 <frame src="frame_3.html"> 

<frame src="frame_4.html">

 </frameset>

HTML frameset Tag

Output 



                 Visit This Link 
        To Your extra information 


html form tag