0% found this document useful (0 votes)
2 views

BASIC_HTML_TAGS

The document provides an introduction to HTML, detailing its purpose as a markup language for creating web pages and its evolution from HTML 2.0 to HTML 5. It explains various HTML tags, their functions, and how to structure content using headings, paragraphs, lists, tables, and other elements. Additionally, it covers attributes for styling and formatting text, as well as the use of containers like <div> and <span> for grouping content.

Uploaded by

ajithkumarposa
Copyright
© © All Rights Reserved
Available Formats
Download as PPSX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
2 views

BASIC_HTML_TAGS

The document provides an introduction to HTML, detailing its purpose as a markup language for creating web pages and its evolution from HTML 2.0 to HTML 5. It explains various HTML tags, their functions, and how to structure content using headings, paragraphs, lists, tables, and other elements. Additionally, it covers attributes for styling and formatting text, as well as the use of containers like <div> and <span> for grouping content.

Uploaded by

ajithkumarposa
Copyright
© © All Rights Reserved
Available Formats
Download as PPSX, PDF, TXT or read online on Scribd
You are on page 1/ 72

Introduction to HTML

HTML stands for Hyper Text Markup Language, which is the most widely
used language on Web to develop web pages.

HTML 2.0 was the first standard HTML specification which was published
in 1995.

HTML 4.01 was a major version of HTML and it was published in late
1999.

currently we are having HTML-5 version which was published in 2012.


HTML stands for Hypertext Markup Language, and it is the
most widely used language to write Web Pages.

Hypertext refers to the way in which Web pages (HTML


documents) are linked together. Thus, the link available on a
webpage is called Hypertext.

As its name suggests, HTML is a Markup Language which


means we use HTML to simply "mark-up" a text document with
tags that tell a Web browser how to structure it to display.
Basic HTML Document

<html>
<head>
<title>This is document title</title>
</head>
<body>
<h1>This is a heading</h1>
<p>Document content goes here.....</p>
</body>
</html>

output
This is a heading
Document content goes here.....
HTML Tags

HTML is a markup language and makes use of various tags


to format the content.

These tags are enclosed within angle braces <Tag


Name>.

Tags have their corresponding closing tags.

For example, <html> has its closing


tag </html> and <body> tag has its closing
tag </body> tag etc.
Heading Tags

Any document starts with a heading.

We can use different sizes for your headings.

HTML also has six levels of headings, which use the


elements <h1>, <h2>, <h3>, <h4>, <h5>, and <h6>.

While displaying any heading, browser adds one line


before and one line after that heading.
<html>
output
<head>
<title>Heading Example</title>
</head>

<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>

</html>
Paragraph Tag

The <p> tag offers a way to structure your text into different paragraphs.

Each paragraph of text should go in between an opening <p> and a closing </p> tag

<html>

<head> Output
<title>Paragraph Example</title>
</head> Here is a first paragraph of text.

<body> Here is a second paragraph of text.


<p>Here is a first paragraph of text.</p>
<p>Here is a second paragraph of text.</p> Here is a third paragraph of text.
<p>Here is a third paragraph of text.</p>
</body>

</html>
Line Break Tag

Whenever you use the <br /> element, anything following it


starts from the next line.

The <br /> tag has a space between the characters br and the
forward slash.

If you omit this space, older browsers will have trouble rendering
the line break, while if you miss the forward slash character and
just use <br> it is not valid in XHTML.
<html>

<head>
<title>Line Break Example</title>
</head>

<body>
<p>Hello<br />
You delivered your assignment on time.<br />
Thanks<br />
james</p> Output
</body>
Hello
You delivered your assignment on time.
</html> Thanks
james
Centering Content

You can use <center> tag to put any content in the center of the page or any table cell.

<html>

<head>
<title>Centring Content Example</title>
</head>
Output
<body>
<p>This text is not in the center.</p> This text is not in the center.

<center> This text is in the center.


<p>This text is in the center.</p>
</center>
</body>

</html>
Horizontal Lines

Horizontal lines are used to visually break-up sections of a document.


The <hr> tag creates a line from the current position in the document to the right
margin and breaks the line accordingly.

<html>

<head>
<title>Horizontal Line Example</title>
</head>

<body>
<p>This is paragraph one and should be on top</p>
<hr />
<p>This is paragraph two and should be at
bottom</p>
</body>

</html>
Preserve Formatting

Sometimes, we want your text to follow the exact format of how it is written in the
HTML document. In these cases, you can use the preformatted tag <pre>.

Any text between the opening <pre> tag and the closing </pre> tag will preserve the
formatting of the source document.

<html>

<head>
<title>Preserve Formatting Example</title>
</head>
Output

<body> function testFunction( strText ){


<pre>
function testFunction( strText ){
alert (strText)
alert (strText) }
}
</pre>
</body>

</html>
align attribute: left, center and right.

<html>

<head>
<title>Align Attribute Example</title> Output
</head>
This is left aligned
<body>
This is center aligned
<p align = "left">This is left aligned</p>
<p align = "center">This is center aligned</p> This is right aligned
<p align = "right">This is right aligned</p>
</body>

</html>

Valign-top, middle, bottom: Vertically aligns tags within an HTML element.


The title Attribute

The title attribute gives a suggested title for the element.

The behavior of this attribute will depend upon the element that carries it, although it is
often displayed as a tooltip when cursor comes over the element or while the element is
loading.
<html>

<head>
<title>The title Attribute Example</title>
</head>

<body>
<h3 title = "Hello HTML!">Titled Heading Tag
Example</h3>
</body>

</html>
The dir Attribute

The dir attribute allows you to indicate to the browser about the direction in which
the text should flow.
The dir attribute can take one of two values:ltr and rtl

<html dir = "rtl">

<head>
<title>Display Directions</title>
</head>

<body>
This is an example for right-to-left directed
text.
</body>

</html>
Background color

Bgcolor-numeric, hexidecimal, RGB values:Places a background color


behind an element

Bold Text
Anything that appears within <b>...</b> element, is displayed in bold

Italic Text
Anything that appears within <i>...</i> element is displayed in italicized

Underlined Text
Anything that appears within <u>...</u> element, is displayed with
underline
Strike Text
Anything that appears within <strike>...</strike> element is displayed with strikethrough

Monospaced Font
The content of a <tt>...</tt> element is written in monospaced font. Most of the fonts are
known as variable-width fonts because different letters are of different widths (for
example, the letter 'm' is wider than the letter 'i'). In a monospaced font, however, each
letter has the same width.

Superscript Text
The content of a <sup>...</sup> element is written in superscript; the font size used is the
same size as the characters surrounding it but is displayed half a character's height above
the other characters.

Subscript Text
The content of a <sub>...</sub> element is written in subscript; the font size used is the
same as the characters surrounding it, but is displayed half a character's height beneath
the other characters.
Inserted Text
Anything that appears within <ins>...</ins> element is displayed as inserted text.

Deleted Text
Anything that appears within <del>...</del> element, is displayed as deleted text.

Larger Text
The content of the <big>...</big> element is displayed one font size larger than the rest of
the text surrounding it

Smaller Text
The content of the <small>...</small> element is displayed one font size smaller than the
rest of the text surrounding it
Grouping Content

The <div> and <span> elements allow you to group together several elements to create
sections or subsections of a page.

For example, you might want to put all of the footnotes on a page within a <div>
element to indicate that all of the elements within that <div> element relate to the
footnotes. You might then attach a style to this <div> element so that they appear using
a special set of style rules.

The <span> element, on the other hand, can be used to group inline elements only. So,
if you have a part of a sentence or paragraph which you want to group together, you
could use the <span>
<html> <html>

<head> <head>
<title>Div Tag Example</title> <title>Span Tag Example</title>
</head> </head>

<body> <body>
<div id = "menu" align = "middle" > <p>This is the example of <span style = "color:green">span
<a href = "/index.htm">HOME</a> | tag</span>
<a href = "/about/contact_us.htm">CONTACT</a> | and the <span style = "color:red">div tag</span>
<a href = "/about/index.htm">ABOUT</a> alongwith CSS</p>
</div> </body>

<div id = "content" align = "left" bgcolor = "white"> </html>


<h5>Content Articles</h5>
<p>Actual content goes here.....</p>
</div>
</body>

</html>
Emphasized Text
Anything that appears within <em>...</em> element is displayed as emphasized text.

Marked Text
Anything that appears with-in <mark>...</mark> element, is displayed as marked with yellow ink.

Strong Text
Anything that appears within <strong>...</strong> element is displayed as important text.

Text Direction
The <bdo>...</bdo> element stands for Bi-Directional Override and it is used to override the current text
direction.

Short Quotations
The <q>...</q> element is used when you want to add a double quote within a sentence.

Address Text
The <address>...</address> element is used to contain any address.
 <bdo dir="rtl">
 This text will go right-to-left.
 </bdo>

 HTML has several list elements. Most list elements are composed of
one or more <LI> (List Item) elements.
 UL : Unordered List. Items in this list start with a list mark such as a
bullet. Browsers will usually change the list mark in nested lists.
 <UL>
 <LI> List item …</LI>
 <LI> List item …</LI>
 </UL>
 Choice of three bullet types: disc(default), circle,
square.
These are controlled in Netscape Navigator by the
“TYPE” attribute for the <UL> element.

<UL TYPE=“square”>
<LI> List item …</LI>
<LI> List item …</LI>
<LI> List item …</LI>
</UL>
 OL: Ordered List. Items in this list are numbered
automatically by the browser.
<OL>
<LI> List item …</LI>
<LI> List item …</LI>
<LI> List item …</LI>
</OL>
 choice of setting the TYPE Attribute to one of five
numbering styles.
TYPE Numbering Styles

1 Arabic 1,2,3, ……
numbers

a Lower alpha a, b, c, ……

A Upper alpha A, B, C, ……

i Lower roman i, ii, iii, ……

I Upper roman I, II, III, ……


specify a starting number for an ordered list.
<OL TYPE =“i”>
<LI> List item …</LI>
<LI> List item …</LI>
</OL>
<P> text ….</P>
<OL TYPE=“i” START=“3”>
<LI> List item …</LI>
</OL>
DL: Definition List. This kind of list is different from the others.
Each item in a DL consists of one or more Definition Terms (DT
elements), followed by one or more Definition Description (DD
elements).
<DL>
<DT> HTML </DT>
<DD> Hyper Text Markup Language </DD>
<DT> DOG </DT>
<DD> A human’s best friend!</DD>
</DL>
HTML
Hyper Text Markup Language
DOG
A human’s best friend!
can nest lists by inserting a UL, OL, etc., inside a list item (LI).
EXample
<UL TYPE = “square”>
<LI> List item …</LI>
<LI> List item …
<OL TYPE=“i” START=“3”>
<LI> List item …</LI>
<LI> List item …</LI>
<LI> List item …</LI>
<LI> List item …</LI>
<LI> List item …</LI>
</OL>
</LI>
<LI> List item …</LI>
</UL>
<H1 ALIGN="CENTER">SAFETY TIPS FOR </H1>
<OL TYPE=“a” START=“2”>
<LI>Be able to swim </LI>
<LI>Wear a life jacket at all times </LI>
<LI>Don't stand up or move around. If canoe tips,
<UL>
<LI>Hang on to the canoe </LI>
<LI>Use the canoe for support and </LI>
<LI>Swim to shore
</UL> </LI>
<LI>Don't overexert yourself </LI>
<LI>Use a bow light at night </LI>
</OL>
 The <TABLE></TABLE> element has four sub-elements:
1. Table Row<TR></TR>.
2. Table Header <TH></TH>.
3. Table Data <TD></TD>.
4. Caption <CAPTION></CAPTION>.
 The table row elements usually contain table header
elements or table data elements.
<table border=“1”>
<tr>
<th> Column 1 header </th>
<th> Column 2 header </th>
</tr>
<tr>
<td> Row1, Col1 </td>
<td> Row1, Col2 </td>
</tr>
<tr>
<td> Row2, Col1 </td>
<td> Row2, Col2 </td>
</tr>
</table>
Column 1 Header Column 2 Header

Row1, Col1 Row1, Col2

Row2, Col1 Row2, Col2


TABLE ATTRIBUTES
 BGColor: Some browsers support background colors in a
table.
 Width: you can specify the table width as an absolute
number of pixels or a percentage of the document width.
You can set the width for the table cells as well.
 Border: You can choose a numerical value for the border
width, which specifies the border in pixels.
 CellSpacing: Cell Spacing represents the space between cells
and is specified in pixels.
TABLE ATTRIBUTES
 CellPadding: Cell Padding is the space between the cell
border and the cell contents and is specified in pixels.

 Align: tables can have left, right, or center alignment.



 Background: Background Image, will be titled in IE3.0 and
above.
 BorderColor, BorderColorDark.
 A table caption allows you to specify a line of text that
will appear centered above or bellow the table.
<TABLE BORDER=1 CELLPADDING=2>
<CAPTION ALIGN=“BOTTOM”> Label For My Table
</CAPTION>

 The Caption element has one attribute ALIGN that can


be either TOP (Above the table) or BOTTOM (below the
table).
<html>

<head>
<title>HTML Table Cellpadding</title>
</head>

<body>
<table border = "1" cellpadding = "5" cellspacing = "5">
<tr>
<th>Name</th>
<th>Salary</th>
</tr>
<tr>
<td>Ramesh Raman</td>
<td>5000</td>
</tr>
<tr>
<td>Shabbir Hussein</td>
<td>7000</td>
</tr>
</table>
</body>

</html>
Reference tag/anchor tag

The tags used to produce links are the <A> and </A>.
The <A> tells where the link should start and
the </A> indicates where the link ends.
Everything between these two will work as a link.

The example below shows how to make the word Here work as a link to
yahoo.

Click <A HREF="http://www.yahoo.com">here</A>


Internal Links : Links can also be created inside large documents to simplify
navigation.
Select some text at a place in the document that you would like to create a link
to, then add an anchor to link to like this:
<A NAME=“bookmark_name”></A>
The Name attribute of an anchor element specifies a location in the document
that we link to shortly. All NAME attributes in a document must be unique.
2. Next select the text that you would like to create as a link to the location
created above.
<A HREF=“#bookmark_name”>Go To Book Mark</A>
HTML comments are placed in between <!-- ... --> tags. So, any
content placed with-in <!-- ... --> tags will be treated as comment and
will be completely ignored by the browser.
<html>

<head> <!-- Document Header Starts -->


<title>This is document title</title>
</head> <!-- Document Header Ends -->

<body>
<p>Document content goes here.....</p>
</body>

</html>
Insert Image

You can insert any image in your web page by using <img> tag.

<html>
Set Image Width/Height
<head>
<title>Using Image in Webpage</title>
</head> You can set image width and
height based on your
<body> requirement using width
<p>Simple Image Insert</p>
<img src = "/html/images/test.png" /> and height attributes.
</body>

</html>
Set Image Border <html>

By default, image will have a <head>


border around it, you can specify <title>Set Image Alignment</title>
border thickness in terms of pixels </head>
using border attribute.
<body>
Set Image Alignment <p>Setting image Alignment</p>
<img src = "/html/images/test.png"
By default, image will align at the alt = "Test Image" border = "3" align =
left side of the page, but you can "right"/>
use align attribute to set it in the </body>
center or right.
</html>
Colspan and Rowspan Attributes

We will use colspan attribute if you want to merge two or more columns into a single column.
Similar way use rowspan if we want to merge two or more rows.
<html>
<head>
<title>HTML Table Colspan/Rowspan</title>
</head> <tr>
<td>Row 2 Cell 2</td>
<body> <td>Row 2 Cell 3</td>
<table border = "1"> </tr>
<tr> <tr>
<th>Column 1</th> <td colspan = "3">Row 3 Cell 1</td>
<th>Column 2</th>
<th>Column 3</th> </tr>
</tr> </table>
<tr> </body>
<td rowspan = "2">Row 1 Cell 1</td>
<td>Row 1 Cell 2</td> </html>
<td>Row 1 Cell 3</td>
</tr>
Table Height and Width

You can set a table width and height using width and height attributes.

<html> <tr>
<td>Row 2, Column 1</td>
<head> <td>Row 2, Column 2</td>
<title>HTML Table Width/Height</title> </tr>
</head> </table>
</body>
<body>
<table border = "1" width = "400" height = </html>
"150">
<tr>
<td>Row 1, Column 1</td>
<td>Row 1, Column 2</td>
</tr>
Table Header, Body, and Footer

Tables can be divided into three portions − a header, a body, and a foot.

•<thead> − to create a separate table header.


•<tbody> − to indicate the main body of the table.
•<tfoot> − to create a separate table footer.
Frames
•Frames are rectangular sections of the display window, each of which can display a different
document
•The <frameset> tag specifies the number of frames and their layout in the window
•<frameset> takes the place of <body>
•Cannot have both!
•<frameset> must have either a rows attribute or a cols attribute, or both (usually the case)
•Default is 1
•The possible values for rows and cols are numbers, percentages, and asterisks
•A number value specifies the row height in pixels - Not terribly useful!
•A percentage specifies the percentage of total window height for the row - Very useful!
Frames (continued)
• An asterisk after some other specification gives the remainder
of the height of the window
• Examples:

<frameset rows = "150, 200, 300">

<frameset rows = "25%, 50%, 25%">

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

<frameset rows = "50%, 25%, 25%"


cols = "40%, *">
The <frame> tag specifies the content of a frame

The first <frame> tag in a <frameset> specifies the content of the first frame, etc.
Row-major order is used
Frame content is specified with the src attribute
Without a src attribute, the frame will be empty (such a frame CANNOT be filled later)

If <frameset> has fewer <frame> tags than frames, the extra frames are empty
Creating Frames

To use frames on a page we use <frameset> tag instead of <body> tag.

The <frameset> tag defines, how to divide the window into frames.

The rows attribute of <frameset> tag defines horizontal frames


and cols attribute defines vertical frames.

Note: HTML 5 is not supporting frame tag


<html>

<head>
<title>HTML Frames</title>
</head>

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


<frame name = "top" src = "/html/top_frame.htm" />
<frame name = "main" src = "/html/main_frame.htm" />
<frame name = "bottom" src = "/html/bottom_frame.htm" />

<noframes>
<body>Your browser does not support frames.</body>
</noframes>

</frameset>

</html>
We can define an inline frame with HTML tag <iframe>.

The <iframe> tag is not somehow related to <frameset> tag, instead, it


can appear anywhere in your document.

The <iframe> tag defines a rectangular region within the document in


which the browser can display a separate document, including scrollbars
and borders.

An inline frame is used to embed another document within the current


HTML document.
<html>

<head>
<title>HTML Iframes</title>
</head>

<body>
<p>Document content goes here...</p>

<iframe src = "/html/menu.htm" width = "555" height = "200">


Sorry your browser does not support inline frames.
</iframe>

<p>Document content also go here...</p>


</body>

</html>
Set Font Size

You can set content font size using size attribute. The range of accepted
values is from 1(smallest) to 7(largest). The default size of a font is 3.
<html>

<head>
<title>Setting Font Size</title>
</head>

<body>
<font size = "1">Font size = "1"</font><br />
<font size = "2">Font size = "2"</font><br />
<font size = "3">Font size = "3"</font><br />
<font size = "4">Font size = "4"</font><br />
<font size = "5">Font size = "5"</font><br />
<font size = "6">Font size = "6"</font><br />
<font size = "7">Font size = "7"</font>
</body>

</html>
The <marquee> Tag
An HTML marquee is a scrolling piece of text displayed either
horizontally across or vertically down your webpage depending on the
settings.
<html>

<head>
<title>HTML marquee Tag</title>
</head>

<body>
<marquee>This is basic example of marquee</marquee>
</body>

</html>
<body>
<marquee direction = "right">This text will scroll from left to right</marquee>
</body>

<body>
<marquee direction = "up">This text will scroll from bottom to up</marquee>
</body>
The HTML Style Attribute
<tagname style="property:value;">

<body style="background-color:powderblue;">
<h1 style="color:blue;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>
<h1 style="font-family:verdana;">This is a heading</h1>
<p style="font-family:courier;">This is a paragraph.</p>
<h1 style="font-size:300%;">This is a heading</h1>
<p style="font-size:160%;">This is a paragraph.</p>
<h1 style="text-align:center;">Centered Heading</h1>
<p style="text-align:center;">Centered paragraph.</p>
HTML Colors

<h1 style="background-color:DodgerBlue;">Hello World</h1>


<p style="background-color:Tomato;">Lorem ipsum...</p>

<h1 style="color:Tomato;">Hello World</h1>


<p style="color:DodgerBlue;">Lorem ipsum...</p>
<p style="color:MediumSeaGreen;">Ut wisi enim...</p>

<h1 style="background-color:rgb(255, 99, 71);">...</h1>


<h1 style="background-color:#ff6347;">...</h1>
<h1 style="background-color:hsl(9, 100%, 64%);">...</h1>

<h1 style="background-color:rgba(255, 99, 71, 0.5);">...</h1>


<h1 style="background-color:hsla(9, 100%, 64%, 0.5);">...</h1>
Image as a Link

<a href="default.asp">

<img src=“picture1.jpeg" alt=“Image as link"


style="width:42px;height:42px;border:0;">

</a>
Image Floating
<p> <img src="smiley.gif" alt="Smiley face"
style="float:right;width:42px;height:42px;">
The image will float to the right of the text.</p>

<p><img src="smiley.gif" alt="Smiley face"


style="float:left;width:42px;height:42px;">
The image will float to the left of the text.</p>
Image Maps
The <map> tag defines an image-map. An image-map is an image with
clickable areas.

In the image below, click on the computer, the phone, or the cup of coffee:
<img src="workplace.jpg" alt="Workplace" usemap="#workmap">

<map name="workmap">

<area shape="rect" coords="34,44,270,350" alt="Computer"


href="computer.htm">

<area shape="rect" coords="290,172,333,250" alt="Phone"


href="phone.htm">

<area shape="circle" coords="337,300,44" alt="Coffee"


href="coffee.htm">
</map>
Background Image
<body style="background-image:url('clouds.jpg');">

<h2>Background Image</h2>

</body>

<p style="background-image:url('clouds.jpg');">
...
</p>
The <div> Element
The <div> element is often used as a container for other HTML
elements.

<div style="background-color:black;color:white;padding:20px;">
<h2>London</h2>
<p>London is the capital city of England. It is the most populous
city in the United Kingdom, with a metropolitan area of over 13
million inhabitants.</p>
</div>
The <span> Element

The <span> element is often used as a container for some text.

<h1>My <span style="color:red">Important</span> Heading</h1>


HTML Iframes
An iframe is used to display a web page within a web page.

<iframe src="URL"></iframe>

<iframe src="demo_iframe.htm" height="200"


width="300"></iframe>

<iframe src="demo_iframe.htm"
style="height:200px;width:300px;"></iframe>
<iframe src="demo_iframe.htm" style="border:none;"></iframe>

<iframe src="demo_iframe.htm" style="border:2px solid


red;"></iframe>
Iframe - Target for a Link
An iframe can be used as the target frame for a link.

The target attribute of the link must refer to the name attribute of the
iframe:

<iframe src="demo_iframe.htm"
name="iframe_a"></iframe>

<p><a href="https://www.google.com"
target="iframe_a">Load new web page</a></p>
HTML Entities
Result Description Entity Name
non-breaking space &nbsp;
< less than &lt;
> greater than &gt;
& ampersand &amp;
" double quotation mark &quot;

' single quotation mark (apostrophe) &apos;

¢ cent &cent;
£ pound &pound;
¥ yen &yen;
€ euro &euro;
© copyright &copy;
® registered trademark &reg;
HTML - Embed Multimedia

Sometimes you need to add music or video into your web page. The
easiest way to add video or sound to your web site is to include the special
HTML tag called <embed>. This tag causes the browser itself to include
controls for the multimedia automatically provided browser supports
<embed> tag and given media type.

You can also include a <noembed> tag for the browsers which don't
recognize the <embed> tag. You could, for example, use <embed> to
display a movie of your choice, and <noembed> to display a single JPG
image if browser does not support <embed> tag.
<html>

<head>
<title>HTML embed Tag</title>
</head>

<body>
<embed src = "/html/yourfile.mid" width = "100%" height = "60" >
<noembed><img src = "yourimage.gif" alt = "Alternative Media" ></noembed>
</embed>
</body>

</html>
Sr.No Attribute & Description
1 align
Determines how to align the object. It can be set to either center, left or right.
2 autostart
This boolean attribute indicates if the media should start automatically. You can set it either true or false.
3 loop
Specifies if the sound should be played continuously (set loop to true), a certain number of times (a positive value) or not at all
(false)
4 playcount
Specifies the number of times to play the sound. This is alternate option for loop if you are usiong IE.
5 hidden
Specifies if the multimedia object should be shown on the page. A false value means no and true values means yes.
6 width
Width of the object in pixels
7 height
Height of the object in pixels
8 name
A name used to reference the object.
9 src
URL of the object to be embedded.
10 volume
Controls volume of the sound. Can be from 0 (off) to 100 (full volume).
Background Audio

You can use HTML <bgsound src=“ ”> tag to play a soundtrack in the
background of your webpage. This tag is supported by Internet Explorer only
and most of the other browsers ignore this tag. It downloads and plays an
audio file when the host document is first downloaded by the user and
displayed. The background sound file also will replay whenever the user
refreshes the browser.

You might also like