SHORT NOTES
<head> Main Contents
<title>
<b> or <strong> - Used to Bold the Paragraph
<big> - Used to big text
<i> - Used to Italic the Paragraph
<u> - Used to Underline the Paragraph
<s> - Used to Strikethrough the Paragraph
<sup> - Used to Superscript the Paragraph
<sub> - Used to Subscript the Paragraph
<br> - Used to break the Paragraph
<h1> to <h6> - Used to define header 1 to header 6
<p> - Used to paragraph
<hr> - Used to horizontal rule
<left>, <center>, <right> - Used to set the Paragraph in selected dimension
<pre> - Heading format
  - Horizontal space
<ol> - Order list
<ul> - Unorder list
  - Horizontal Tab
1
Program -1
SIMPLE INTRODUCTION
<html>
<title>Intro</title>
Welcome In LBSTI
Arthala Mohan Nagar
GZB.
</html>
Program -2
SIMPLE INTRODUCTION WITH BREAK CONDITION
<html>
<title>Intro</title>
Welcome In LBSTI<br>
Arthala Mohan Nagar<br>
GZB.<br>
</html>
Program -3
SIMPLE INTRODUCTION WITH Main Header Line
<html>
<title>Intro</title>
<h1>Welcome In LBSTI<br><h1>
2
Arthala Mohan Nagar<br>
GZB.<br>
</html>
Program -4
SIMPLE LINES WITH h1 to h6 series (Header Lines)
<html>
<title>Intro</title>
<h1>Welcome In LBSTI<br></h1>
<h2>Welcome In LBSTI<br></h2>
<h3>Welcome In LBSTI<br></h3>
<h4>Welcome In LBSTI<br></h4>
<h5>Welcome In LBSTI<br></h5>
<h6>Welcome In LBSTI<br></h6>
</html>
Program -5
SIMPLE paragraph with Header, center, right tags with
selected line
<html>
<title>Intro</title>
<h1><center><u>Welcome In LBSTI</center></h1></u>
My Name is Prateek Garg<br><br>
<p align ="right">My Father Name is Sh. Ashok Garg</p><br>
My Brother Name is Mr. Prerit Garg<br><br>
3
</html>
Program -6
SIMPLE paragraph with bold, italic, underline tags
<html>
<title>Intro</title>
<h1><center><u>Welcome In LBSTI</center></h1></u>
<b>My Name is Prateek Garg</b><br><br>
<i>My Father Name is Sh. Ashok Garg</i><br><br>
<u>My Brother Name is Mr. Prerit Garg</u><br><br>
</html>
Program -7
SIMPLE paragraph with superscript and subscript tags
<html>
<title>Intro</title>
I am doing <body>10<sup>th</sup>class<br><br>
This is an oxigen O<sub>2</sub>sign
</html>
Program -8
SIMPLE selected paragraph with pre(L,R,C) tags
<html>
<title>Intro</title>
4
<p align="center"> Welcome in LBSTI<br><br><br>
My Name is Prateek.<br>
My Father Name is Sh. Ashok Garg<br>
My Mother Name is Late Smt. Indra Garg<br>
My Brother Name is Mr. Prerit Garg</p>
<p align="right">
My Name is Prateek.<br>
My Father Name is Sh. Ashok Garg<br>
My Mother Name is Late Smt. Indra Garg<br>
My Brother Name is Mr. Prerit Garg</p>
<p align="left">
My Name is Prateek.<br>
My Father Name is Sh. Ashok Garg<br>
My Mother Name is Late Smt. Indra Garg<br>
My Brother Name is Mr. Prerit Garg</p>
</html>
Program -9
Selected paragraph with background & Text color tags
<html>
<title>Intro</title>
5
<center><body bgcolor="purple"><h1><basefont face="Times new roman" color="white">
Welcome in LBSTI</h1></center>
<basefont face="Times new roman" size="4" color="white">
My Name is Prateek.<br>
<basefont face="Times new roman" color="yellow">My Father Name is Sh. Ashok Garg<br>
<basefont face="Times new roman" size="4" color="white">
My Mother Name is Late Smt. Indra Garg<br>
My Brother Name is Mr. Prerit Garg</p>
</html>
Program -10
Insert Image + adjustment with selected tags
<html>
<title>Intro</title>
<body>
<center><h1>This is beautiful Amrita Rao</center></h1>
<imgsrc="E:\wallpapers\MiXeS\amr110110_1024.jpg" width="300" height="250"
style="border:10px solid yellow">
</html>
Program -11
Add Marquee in Wallpaper or Text
<html>
<title>user</title>
<marquee> thi s is a user . </marquee>
6
<marquee> direction =”right”> this is a user. </marquee>
<marquee direction =”up”> this is a user .</marquee>
<marquee direction =”down”> this is a user.</marquee>
<marquee behaviour=” alternate”>this is a user.</marquee>
<marquee scrollamount=”20” >scrollamount marquee equal 10 .</marquee>
<marquee behaviour=”alternate”><marquee width=”200”>reccuring
marquee</marquee></marquee>
<centre><marquee> scrollamount =”s” width=”40”>& it; ⁢⁢</marquee>opposite direction
marquee <marquee scrollamount =”s” direction =”right” width=”40”>>>></marquee>
<marquee width=”6%”direction =“up” behaviour=”alternate”><marquee direction=”right”
behaviour “alternate” >zigzag marquee</marquee >
</marquee>
</html>
Program -12
Add tab in paragraph lines
<html>
<body>
<dl>
<dt>My Name</dt>
<dd>Prateek Garg</dd>
<dt>My Father</dt>
<dd>Ashok Garg</dd>
</dl>
</body>
7
</html>
Program -13
Headings tags (1.2.3.)in Paragraph
<html>
<body>
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ol start="50">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
Program -14
Headings tags (*.>.-.)in Paragraph
<html>
<body>
<h4>An Unordered List:</h4>
<ul>
<li>Coffee</li>
8
<li>Tea</li>
<li>Milk</li>
</ul>
</body>
</html>
Program -15
Drop down list tags
<html>
<body>
<select>
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
</body>
</html>
9
Program -17
Addition program tag
<html>
<body>
<form oninput="[Link]=parseInt([Link])+parseInt([Link])">0
<input type="range" id="a" value="50">100
+<input type="number" id="b" value="50">
=<output name="x" for="a b"></output>
</form>
<p><strong>Note:</strong> The output tag is not supported in Internet Explorer.</p>
</body>
</html>
Program -18
Simple Table tag
<html>
<body>
<table style="width:100%">
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
10
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
<tr>
<td>John</td>
<td>Doe</td>
<td>80</td>
</tr>
</table>
</body>
</html>
Program -19
Table tag
<html>
<head>
<style>
table, th, td {
border: 1px solid black;
</style>
</head>
<body>
11
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</table>
</html>
Program -20
Color table tag
<html>
<head>
<style>
thead {color:green;}
tbody {color:blue;}
12
tfoot {color:red;}
table, th, td {
border: 1px solid black;
</style>
</head>
<body>
<table>
<thead>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
</thead>
<tfoot>
<tr>
<td>Sum</td>
<td>$180</td>
</tr>
</tfoot>
<tbody>
13
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</tbody>
</table>
</body>
</html>
Program -21
Scroll up-down paragraph tag
<html>
<body>
<textarea rows="4" cols="50">
LalBahadurShastri Training Institute is having a theme of providing quality education at dream
[Link] Training Institute aims at serving the people of the country by making
them competent & strong enough to face the running life of the upcoming technologies. Our
centres provide quality education in Computers, Fashion Designing, Beautician, Spoken English,
Call Centre Training , N.T.T ( Nursery Teacher's Training ), NPTT ( Nursery and Primary Teacher's
Training ). We have created a very friendly learning environment with the latest tools of
[Link] of candidates are sent by as to the corporations after the customized and
individual training using our state-of-the-art training facilities.
</textarea>
14
</body>
</html>
Program -22
Hyperlink tag
<html>
<body>
<p>
<a href="[Link] on This Link</a>
</p>
</body>
</html>
Program -24
FORM CREATED TAGS
<form name="htmlform" method="post" action="html_form_send.php">
<table width="450px">
</tr>
<tr>
<td valign="top">
<label for="first_name">First Name *</label>
</td>
<td valign="top">
<input type="text" name="first_name" maxlength="50" size="30">
15
</td>
</tr>
<tr>
<td valign="top"">
<label for="last_name">Last Name *</label>
</td>
<td valign="top">
<input type="text" name="last_name" maxlength="50" size="30">
</td>
</tr>
<tr>
<td valign="top">
<label for="email">Email Address *</label>
</td>
<td valign="top">
<input type="text" name="email" maxlength="80" size="30">
</td>
</tr>
<tr>
<td valign="top">
<label for="telephone">Telephone Number</label>
</td>
<td valign="top">
<input type="text" name="telephone" maxlength="30" size="30">
16
</td>
</tr>
<tr>
<td valign="top">
<label for="comments">Comments *</label>
</td>
<td valign="top">
<textarea name="comments" maxlength="1000" cols="25" rows="6"></textarea>
</td>
</tr>
<tr>
<td colspan="2" style="text-align:center">
<input type="submit" value="Submit">( <a
href="[Link] Form</a> )
</td>
</tr>
</table>
</form>
Program -25
FORM RADIO BUTTON TAGS
<form action="[Link]">
<input type="radio" name="color" value="red" /> Red<br />
<input type="radio" name="color" value="white" /> White<br />
<input type="radio" name="color" value="blue" /> Blue<br />
<input type="radio" name="color" value="green" /> Green<br />
</form>
17
Program -26
FORM CHECK BOX TAGS
<form action="[Link]">
<input type="checkbox" name="friut" value="apples" /> Apples<br />
<input type="checkbox" name="friut" value="oranges" /> Oranges<br />
<input type="checkbox" name="friut" value="pears" /> Pears<br />
<input type="checkbox" name="friut" value="peaches" /> Peaches<br />
</form>
Program -27
FORM UPLOAD FILE/PICS TAGS
<form action="[Link]" enctype="multipart/form-data">
Select a file to upload: <input type="file" name="selectedfile" />
</form>
18
Program -28
FORM DROP UP/DOWN TAGS
<form action="[Link]">
Select Something:
<select name="something">
<option value="Google">Google</option>
<option value="Bing">Bing</option>
<option value="Yahoo">Yahoo</opton>
</select>
</form>
19