Web Engg. CS801 Practical

Department-Computer Science &Engg.
(CS-VIII Sem)
1.
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph. </p>
</body>
</html>
Output
My First Heading
My first paragraph.
2.
<html>
<body>
<h1>This is heading 1</h1>
</body>
</html>
Output
This is heading 1
This is heading 2
This is heading 3
This is heading 4
This is heading 5
This is heading 6
3.
<html>
<body>
<p>This is a paragraph.</p>
NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

Thakur baba campus, jhansi road sitholi, gwalior (M.P.)
Contact No.-0751-2387520,9685396020
Department-Computer Science &Engg. (CS-VIII Sem)
</body>
</html>
Output
This is a paragraph.
4.
<html>
<body>
<a href="http://www.w3schools.com">
This is a link</a>
</body>
</html>
Output
This is a link
5.
<html>
<body>
<img src="w3schools.jpg" width="104" height="142" />
</body>
</html>
Output
Image
6.
<html>
<body>
</body>

Contact No.-0751-2387520,9685396020
</html>
Output
This is heading 1
This is heading 2
This is heading 3
This is heading 4
This is heading 5
This is heading 6
<html>
<body>

<p>This is a regular paragraph</p>
</body>
</html>
Output
This is a regular paragraph
8.
<html>
<body>
<p>The hr tag defines a horizontal rule:</p>
<hr />
<p>This is a paragraph</p>
<hr />
<hr />
</body>
</html>
Output
The hr tag defines a horizontal rule:
This is a paragraph
This is a paragraph

Contact No.-0751-2387520,9685396020
This is a paragraph
9.
<html>
<body>
<p>This is<br />a para<br />graph with line breaks</p>
</body>
</html>
Output
This is
a para
graph with line breaks
10.
<html>
<body>
<p><b>This text is bold</b></p>
<p><strong>This text is strong</strong></p>
<p><big>This text is big</big></p>
<p><em>This text is emphasized</em></p>
<p><i>This text is italic</i></p>
<p><small>This text is small</small></p>
<p>This is<sub> subscript</sub> and <sup>superscript</sup></p>
</body>
</html>
Output
This text is bold
This text is strong
This text is big
This text is emphasized
This text is italic
This text is small
This is subscript and superscript
11.

Contact No.-0751-2387520,9685396020
<html>
<body>
<pre>
This is
preformatted text.
It preserves both spaces
and line breaks.
</pre>
<p>The pre tag is good for displaying computer code:</p>
<pre>
for i = 1 to 10
print i
next i
</pre>
</body>
</html>
Output
This is
preformatted text.
It preserves both spaces
and line breaks.
The pre tag is good for displaying computer code:
for i = 1 to 10
print i
next i
12.
<html>
<body>
<code>Computer code</code>
<br />
<kbd>Keyboard input</kbd>
<br />
<tt>Teletype text</tt>
<br />
<samp>Sample text</samp>
<br />
<var>Computer variable</var>
<br />
<p><b>Note:</b> These tags are often used to display computer/programming code.</p>

Contact No.-0751-2387520,9685396020
</body>
</html>
Output
Computer code
Keyboard input
Teletype text
Sample text
Computer variable
Note: These tags are often used to display computer/programming code.
13.
<html>
<body>
<address>
Written by W3Schools.com<br />
<a href="mailto:us@example.org">Email us</a><br />
Address: Box 564, Disneyland<br />
Phone: +12 34 56 78
</address>
</body>
</html>
Output
Written by W3Schools.com
Email us
Address: Box 564, Disneyland
Phone: +12 34 56 78
14.
<html>
<body>
<p>My favorite color is <del>blue</del> <ins>red</ins>!</p>
<p>Notice that browsers will strikethrough deleted text and underline inserted text.</p>
</body>
</html>
Output
My favorite color is blue red!
Notice that browsers will strikethrough deleted text and underline inserted text.

Contact No.-0751-2387520,9685396020
15.
<html>
<body>
<p>
<a href="default.asp">HTML Tutorial</a> This is a link to a page on this website.
</p>
<p>
<a href="http://www.google.com/">Google</a> This is a link to a website on the World Wide Web.
</p>
</body>
</html>
Output
HTML Tutorial This is a link to a page on this website.
Google This is a link to a website on the World Wide Web.
16.
<html>
<body>
<p>Create a link of an image:
<a href="default.asp">
<img src="smiley.gif" alt="HTML tutorial" width="32" height="32" />
</a></p>
<p>No border around the image, but still a link:
<img border="0" src="smiley.gif" alt="HTML tutorial" width="32" height="32" />
</a></p>
</body>
</html>
Output
Create a link of an image:
No border around the image, but still a link:
17.

Contact No.-0751-2387520,9685396020
<html>
<body>
<a href="http://www.w3schools.com" target="_blank">Visit W3Schools.com!</a>
<p>If you set the target attribute to "_blank", the link will open in a new browser window/tab.</p>
</body>
</html>
Output
Visit W3Schools.com!
If you set the target attribute to "_blank", the link will open in a new browser window/tab.
18.
<html>
<body>
<p>
<a href="#C4">See also Chapter 4.</a>
</p>
<h2>Chapter 1</h2>
<p>This chapter explains ba bla bla</p>
<h2>Chapter 2</h2>
<h2>Chapter 3</h2>
<h2><a name="C4">Chapter 4</a></h2>
<h2>Chapter 5</h2>
<h2>Chapter 6</h2>
<h2>Chapter 7</h2>
<h2>Chapter 8</h2>
<h2>Chapter 9</h2>
<h2>Chapter 10</h2>
<h2>Chapter 11</h2>
<h2>Chapter 12</h2>

Contact No.-0751-2387520,9685396020
<h2>Chapter 13</h2>
<h2>Chapter 14</h2>
<h2>Chapter 15</h2>
<h2>Chapter 16</h2>
<h2>Chapter 17</h2>
</body>
</html>
Output
See also Chapter 4.
Chapter 1
This chapter explains ba bla bla
Chapter 2
Chapter 3
Chapter 4
Chapter 5
Chapter 6
Chapter 7
Chapter 8
Chapter 9
Chapter 10
Chapter 11
Chapter 12
Chapter 13

Contact No.-0751-2387520,9685396020
Chapter 14
Chapter 15
Chapter 16
Chapter 17
19.
<html>
<body>
<p>Locked in a frame?</p>
<a href="http://www.w3schools.com/" target="_top">Click here!</a>
</body>
</html>
Output
Locked in a frame?
Click here!
20.
<html>
<body>
<p>
This is an email link:
<a href="mailto:someone@example.com?Subject=Hello%20again">
Send Mail</a>
</p>
<p>
<b>Note:</b> Spaces between words should be replaced by %20 to ensure that the browser will display
the text properly.
</p>
</body>
</html>
Output
Contact No.-0751-2387520,9685396020
Department
This is an email link: Send Mail

Note: Spaces between words should be replaced by %20 to ensure that the browser will display
the text properly.
21.
<html>
<body>
<p>
An image:
<img src="smiley.gif" alt="Smiley face" width="32" height="32" />
</p>
<p>
A moving image:
lt="Computer man" width="48" height="48" />
<img src="hackanm.gif" alt="Computer
</p>
<p>
Note that the syntax of inserting a moving image is no different from a non
non-moving
moving image.
</p>
</body>
</html>
Output
An image:
A moving image:
Note that the syntax of inserting a moving image is no different from a non-moving
moving image.
22.
<html>
<body>
<p>An image from another folder:</p>
<img src="/images/chrome.gif" alt="Google Chrome" width="33" height="32" />
<p>An image from W3Schools:</p>
<img src="http://www.w3schools.com/images/w3schools_green.jpg"
="http://www.w3schools.com/images/w3schools_green.jpg" alt="W3Schools.com"
width="104" height="142" />
</body>
</html>
An image from another folder:

Contact No.
No.-0751-2387520,9685396020
An image from W3Schools:
23.
<html>
<body>
<p>An image
<img src="smiley.gif" alt="Smiley face" align="bottom" width="32" height="32" />
with align="bottom".</p>
<p>An image
<img src="smiley.gif" alt="Smiley face" align="middle" width="32" height="32" />
with align="middle".</p>
<p>An image
<img src="smiley.gif" alt="Smiley face" align="top" width="32" height="32" />
with align="top".</p>
<p><b>Tip:</b> align="bottom" is default!</p>
<p><img src="smiley.gif" alt="Smiley face" width="32" height="32" />
An image before the text.</p>
<p>An image after the text.
<img src="smiley.gif" alt="Smiley face" width="32" height="32" /></p>
</body>
</html>
An image with align="bottom".
An image with align="middle".
An image with align="top".

Tip: align="bottom" is default!
An image before the text.
An image after the text.

Contact No.-0751-2387520,9685396020
24.
<html>
<body>
<p>
<img src="smiley.gif" alt="Smiley face" align="left" width="32" height="32" />
A paragraph with an image. The align attribute of the image is set to "left". The image will float to the
left of this text.
</p>
<p>
<img src="smiley.gif" alt="Smiley face" align="right" width="32" height="32" />
A paragraph with an image. The align attribute of the image is set to "right". The image will float to the
right of this text.
</p>
</body>
</html>
Output
A paragraph with an image. The align attribute of the image is set to "left". The image will
float to the left of this text.
A paragraph with an image. The align attribute of the image is set to "right". The image will
float to the right of this text.
25.
<html>
<body>
<p>Create a link of an image:
<img src="smiley.gif" alt="HTML tutorial" width="32" height="32" />
</a></p>
<p>No border around the image, but still a link:
<img border="0" src="smiley.gif" alt="HTML tutorial" width="32" height="32" />
</a></p>
</body>
</html>
Output
Create a link of an image:
No border around the image, but still a link:

Contact No.-0751-2387520,9685396020
25.
<html>
<body>
<p>
Each table starts with a table tag.
Each table row starts with a tr tag.
Each table data starts with a td tag.
</p>
<h4>One column:</h4>
<table border="1">
<tr>
<td>100</td>
</tr>
</table>
<h4>One row and three columns:</h4>
<table border="1">
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
</table>
<h4>Two rows and three columns:</h4>
<table border="1">
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
</table>
</body>
</html>
Output
Each table starts with a table tag. Each table row starts with a tr tag. Each table data starts with a
td tag.
Contact No.-0751-2387520,9685396020
One column:
100
One row and three columns:

100 200 300
Two rows and three columns:

100 200 300
400 500 600
26.
<html>
<body>
<h4>With a normal border:</h4>
<table border="1">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>With a thick border:</h4>
<table border="8">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>With a very thick border:</h4>
<table border="15">
<tr>

Contact No.-0751-2387520,9685396020
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
</body>
</html>
Output
With a normal border:
First Row
Second Row
With a thick border:
First Row
Second Row
With a very thick border:
First Row
Second Row
27.
<html>
<body>
<h4>This table has no borders:</h4>
<table>
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>

Contact No.-0751-2387520,9685396020
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
</table>
<h4>And this table has no borders:</h4>
<table border="0">
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
</table>
</body>
</html>
Output
This table has no borders:
100 200 300
400 500 600
And this table has no borders:
100 200 300
400 500 600
28.
<html>
<body>
<h4>Table headers:</h4>
<table border="1">
<tr>
<th>Name</th>
<th>Telephone</th>
<th>Telephone</th>
</tr>
<tr>

Contact No.-0751-2387520,9685396020
<td>Bill Gates</td>
<td>555 77 854</td>
<td>555 77 855</td>
</tr>
</table>
<h4>Vertical headers:</h4>
<table border="1">
<tr>
<th>First Name:</th>
<td>Bill Gates</td>
</tr>
<tr>
<th>Telephone:</th>
<td>555 77 854</td>
</tr>
<tr>
<th>Telephone:</th>
<td>555 77 855</td>
</tr>
</table>
</body>
</html>
Output
Table headers:
Name Telephone Telephone
Bill Gates 555 77 854 555 77 855
Vertical headers:
First Name: Bill Gates
Telephone: 555 77 854
Telephone: 555 77 855
29.
<html>
<body>

Contact No.-0751-2387520,9685396020
<table border="1">
<caption>Monthly savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$50</td>
</tr>
</table>
</body>
</html>
Output
Monthly savings
Month Savings
January $100
February $50
30.
<html>
<body>
<h4>Cell that spans two columns:</h4>
<table border="1">
<tr>
<th>Name</th>
<th colspan="2">Telephone</th>
</tr>
<tr>
<td>Bill Gates</td>
<td>555 77 854</td>
<td>555 77 855</td>
</tr>
</table>
<h4>Cell that spans two rows:</h4>

Contact No.-0751-2387520,9685396020
<table border="1">
<tr>
<th>First Name:</th>
<td>Bill Gates</td>
</tr>
<tr>
<th rowspan="2">Telephone:</th>
<td>555 77 854</td>
</tr>
<tr>
<td>555 77 855</td>
</tr>
</table>
</body>
</html>
Output
Cell that spans two columns:
Name Telephone
Bill Gates 555 77 854 555 77 855
Cell that spans two rows:

First Name: Bill Gates
555 77 854
Telephone:
555 77 855
31.
html>
<body>
<table border="1">
<tr>
<td>
<p>This is another paragraph</p>
</td>
<td>This cell contains a table:

Contact No.-0751-2387520,9685396020
<table border="1">
<tr>
<td>A</td>
<td>B</td>
</tr>
<tr>
<td>C</td>
<td>D</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>This cell contains a list
<ul>
<li>apples</li>
<li>bananas</li>
<li>pineapples</li>
</ul>
</td>
<td>HELLO</td>
</tr>
</table>
</body>
</html>
Output
This is a paragraph This cell contains a table:

AB
This is another paragraph C D
This cell contains a list
• apples
HELLO
• bananas
• pineapples

Contact No.-0751-2387520,9685396020
32.
<html>
<body>
<h4>Without cellspacing:</h4>
<table border="1">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>With cellspacing="0":</h4>
<table border="1" cellspacing="0">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>With cellspacing="10":</h4>
<table border="1" cellspacing="10">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
</body>
</html>
Output

Contact No.-0751-2387520,9685396020
Without cellspacing:
First Row
Second Row
With cellspacing="0":
First Row
Second Row
With cellspacing="10":
First Row
Second Row
32.
<html>
<body>
<p>
<b>Note:</b>
If you see no frames/borders around the tables below, your browser does not support
the "frame" attribute.
</p>
<h4>With frame="border":</h4>
<table frame="border">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>With frame="box":</h4>
<table frame="box">
<tr>
<td>First</td>

Contact No.-0751-2387520,9685396020
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>With frame="void":</h4>
<table frame="void">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>With frame="above":</h4>
<table frame="above">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>With frame="below":</h4>
<table frame="below">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>With frame="hsides":</h4>
<table frame="hsides">
<tr>

Contact No.-0751-2387520,9685396020
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>With frame="vsides":</h4>
<table frame="vsides">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>With frame="lhs":</h4>
<table frame="lhs">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>With frame="rhs":</h4>
<table frame="rhs">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
</body>
</html>

Contact No.-0751-2387520,9685396020
Output
Note: If you see no frames/borders around the tables below, your browser does not support the
"frame" attribute.
With frame="border":
First Row
Second Row
With frame="box":
First Row
Second Row
With frame="void":
First Row
Second Row
With frame="above":
First Row
Second Row
With frame="below":
First Row
Second Row
With frame="hsides":
First Row
Second Row
With frame="vsides":
First Row
Second Row
With frame="lhs":
First Row
Second Row
With frame="rhs":
First Row
Second Row
33.
<html>
<body>
<h4>An Unordered List:</h4>
<ul>

Contact No.-0751-2387520,9685396020
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</body>
</html>
Output
An Unordered List:
• Coffee
• Tea
• Milk
34.
<html>
<body>
<h4>An Ordered List:</h4>
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
Output
An Ordered List:
1. Coffee
2. Tea
3. Milk
34.
<html>
<body>
<h4>Numbered list:</h4>
<ol>
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>

Contact No.-0751-2387520,9685396020
</ol>
<h4>Letters list:</h4>
<ol type="A">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
<h4>Lowercase letters list:</h4>
<ol type="a">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
<h4>Roman numbers list:</h4>
<ol type="I">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
<h4>Lowercase Roman numbers list:</h4>
<ol type="i">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
</body>
</html>
Output
Numbered list:
1. Apples
2. Bananas
3. Lemons
4. Oranges
Letters list:
A. Apples
B. Bananas
C. Lemons
D. Oranges

Contact No.-0751-2387520,9685396020
Lowercase letters list:

a. Apples
b. Bananas
c. Lemons
d. Oranges
Roman numbers list:
I. Apples
II. Bananas
III. Lemons
IV. Oranges
Lowercase Roman numbers list:
i. Apples
ii. Bananas
iii. Lemons
iv. Oranges
35.
<html>
<body>
<h4>Disc bullets list:</h4>
<ul type="disc">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>
<h4>Circle bullets list:</h4>
<ul type="circle">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>
<h4>Square bullets list:</h4>

<ul type="square">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>
</body>
</html>

Contact No.-0751-2387520,9685396020
Output
Disc bullets list:
• Apples
• Bananas
• Lemons
• Oranges
Circle bullets list:
o Apples
o Bananas
o Lemons
o Oranges
Square bullets list:
Apples
Bananas
Lemons
Oranges
36.
<html>
<body>
<h4>A nested List:</h4>
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
</body>
</html>
Output
A nested List:
• Coffee
• Tea
o Black tea
o Green tea
• Milk

Contact No.-0751-2387520,9685396020
36.
<html>
<body>
<h4>A nested List:</h4>
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea
<ul>
<li>China</li>
<li>Africa</li>
</ul>
</li>
</ul>
</li>
<li>Milk</li>
</ul>
</body>
</html>
Output
A nested List:
• Coffee
• Tea
o Black tea
o Green tea
China
Africa
• Milk
37.
<html>
<body>
<h4>A Definition List:</h4>
<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>

Contact No.-0751-2387520,9685396020
</dl>
</body>
</html>
Output
A Definition List:
Coffee
Black hot drink
Milk
White cold drink
38.
<html>
<body>
<form action="">
First name: <input type="text" name="firstname" /><br />
Last name: <input type="text" name="lastname" />
</form>
<p><b>Note:</b> The form itself is not visible. Also note that the default width of a text field is 20
characters.</p>
</body>
</html>
Output
First name:
Last name:
Note: The form itself is not visible. Also note that the default width of a text field is 20
characters.
39.
<html>
<body>
<form action="">
Username: <input type="text" name="user" /><br />
Password: <input type="password" name="password" />
</form>
<p><b>Note:</b> The characters in a password field are masked (shown as asterisks or circles).</p>
</body>
</html>

Contact No.-0751-2387520,9685396020
Output
Username:
Password:
Note: The characters in a password field are masked (shown as asterisks or circles).
40.
<html>
<body>
<form action="">
<input type="checkbox" name="vehicle" value="Bike" /> I have a bike<br />
<input type="checkbox" name="vehicle" value="Car" /> I have a car
</form>
</body>
</html>
Output
I have a bike
I have a car
41.
<html>
<body>
<form action="">
<input type="radio" name="sex" value="male" /> Male<br />
<input type="radio" name="sex" value="female" /> Female
</form>
<p><b>Note:</b> When a user clicks on a radio-button, it becomes checked, and all other radio-buttons
with equal name become unchecked.</p>
</body>
</html>
Output

Contact No.-0751-2387520,9685396020
Male
Female
Note: When a user clicks on a radio-button, it becomes checked, and all other radio-buttons with
equal name become unchecked.
42.
<html>
<body>
<form action="">
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
</form>
</body>
</html>
Output
Volvo
42.
<html>
<body>
<form action="">
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat" selected="selected">Fiat</option>
<option value="audi">Audi</option>
</select>
</form>
</body>
</html>
Output

Contact No.-0751-2387520,9685396020
Fiat
43.
<html>
<body>
<form action="">
<input type="button" value="Hello world!">
</form>
</body>
</html>
Output
Hell World
44.
<html>
<body>
<form action="">
<fieldset>
<legend>Personal information:</legend>
Name: <input type="text" size="30" /><br />
E-mail: <input type="text" size="30" /><br />
Date of birth: <input type="text" size="10" />
</fieldset>
</form>
</body>
</html>
Output
Personal information:
Name:
E-mail:
Date of birth:
45.
<html>
<body>
<form name="input" action="html_form_action.asp" method="get">
First name: <input type="text" name="FirstName" value="Mickey" /><br />
Last name: <input type="text" name="LastName" value="Mouse" /><br />
<input type="submit" value="Submit" />
</form>

Contact No.-0751-2387520,9685396020
<p>If you click the "Submit" button, the form-data will be sent to a page
called "html_form_action.asp".</p>
</body>
</html>
Output
Mickey
First name:
Mouse
Last name:
Submit
If you click the "Submit" button, the form-data will be sent to a page called
"html_form_action.asp".
46.
<html>
<body>
<input type="checkbox" name="vehicle" value="Bike" /> I have a bike<br />
<input type="checkbox" name="vehicle" value="Car" /> I have a car
<br /><br />
</form>
</body>
</html>
Output
I have a bike
I have a car
Submit
47.
<html>
<body>
<input type="radio" name="sex" value="male" /> Male<br />
<input type="radio" name="sex" value="female" /> Female<br />
</form>

Contact No.-0751-2387520,9685396020
</body>
</html>
Output
Male
Female
Submit
48.
<html>
<body>
<h3>Send e-mail to someone@example.com:</h3>
<form action="MAILTO:someone@example.com" method="post" enctype="text/plain">
Name:<br />
<input type="text" name="name" value="your name" /><br />
E-mail:<br />
<input type="text" name="mail" value="your email" /><br />
Comment:<br />
<input type="text" name="comment" value="your comment" size="50" />
<br /><br />
<input type="submit" value="Send">
<input type="reset" value="Reset">
</form>
</body>
</html>
Output
Send e-mail to someone@example.com:
Name:
your name
E-mail:
your email
Comment:
your comment
Send Reset
49.
<html>
<frameset cols="25%,50%,25%">
<frame src="frame_a.htm" />
<frame src="frame_b.htm" />

Contact No.-0751-2387520,9685396020
<frame src="frame_c.htm" />

</frameset>
</html>
50.
<html>
<frameset rows="25%,50%,25%">
</frameset>
</html>
51.
<html>
<frameset rows="50%,50%">
<frameset cols="25%,75%">
</frameset>
</frameset>
</html>
52.
<html>
<frameset rows="50%,50%">
<frame noresize="noresize" src="frame_a.htm" />
<frame noresize="noresize" src="frame_b.htm" />
</frameset>
</html>
53.
<html>
<frameset cols="120,*">
<frame src="tryhtml_contents.htm" />
<frame src="frame_a.htm" name="showframe" />
</frameset>
</html>
54.

Contact No.-0751-2387520,9685396020
<html>
<body>
<iframe src="demo_iframe.htm"></iframe>
<p>Some older browsers don't support iframes.</p>
<p>If they don't, the iframe will not be visible.</p>
</body>
</html>
55.
<html>
<head>
<style type="text/css">
h1 {color:red;}
h2 {color:blue;}
p {color:green;}
</style>
</head>
<body>
<h1>All header 1 elements will be red</h1>
<h2>All header 2 elements will be blue</h2>
<p>All text in paragraphs will be green.</p>
</body>
</html>
56.
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<h1>I am formatted with an external style sheet</h1>
<p>Me too!</p>
</body>
</html>
57.
<html>
<body>
<script type="text/javascript">
document.write("Hello World!")
</script>
</body>

Contact No.-0751-2387520,9685396020
</html>

Contact No.-0751-2387520,9685396020

Web Engg. CS801 Practical

Hochgeladen von

Dokumentinformationen

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

Web Engg. CS801 Practical

Hochgeladen von

Copyright:

Verfügbare Formate

Department-Computer Science &Engg.

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

This text is strong

This text is big

This text is emphasized

This text is italic

This text is small

This is subscript and superscript

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

Note: These tags are often used to display computer/programming code.

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

No border around the image, but still a link:

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

This is an email link: Send Mail

An image from another folder:

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

An image from W3Schools:

An image with align="bottom".

An image with align="middle".

An image with align="top".

An image before the text.

An image after the text.

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

No border around the image, but still a link:

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

One row and three columns:

Two rows and three columns:

400 500 600

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

With a thick border:

With a very thick border:

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

Bill Gates 555 77 854 555 77 855

Telephone: 555 77 854

Telephone: 555 77 855

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

Bill Gates 555 77 854 555 77 855

Cell that spans two rows:

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

This is a paragraph This cell contains a table:

This cell contains a list

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

Lowercase letters list:

<h4>Square bullets list:</h4>

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT

NAGAJI INSTITUTE OF TECHNOLOGY & MANAGEMENT