Impressive Web Designing

Impressive Web Designing (HTML)

·        Write html program to demonstrate text formatting tags.
Text.html
<html>
<head>
<title>Physical Tags</title>
</head>
<body>
<b>The B tag indicate text in bold face </b> <br><br>
<i>The I tag indicate text in Italic </i> <br><br>
<u>The U tag is used to underline the text </u> <br><br>
<s>The s tag is used to strike through text</s><br><br>
<ins>The ins tag is used to show inserted text</ins><br><br> 
<big> The Big tag is used to display text in 1 size larger font than surrounding text </big><br><br>
<small>The small tag is used to display text in 1 size smaller font than surrounding text </small><br><br>
<mark>This text is marked</mark><br><br>
<del>The del tag is displayed as a deleted text</del><br><br>
This is the example of superscript tag : (a+b)<sup>2</sup> <br><br>
This is the example of subscript tag : H<sub>2</sub>O
</body>
</html>
·        Write html program to demonstrate various heading levels.
Heading.html
<html>
<head>
<title>Heading Tags</title>
</head>
<body>
<h1>This is the Heading Level 1</h1>
<h2>This is the Heading Level 2</h2>
<h3>This is the Heading Level 3</h3>
<h4>This is the Heading Level 4</h4>
<h5>This is the Heading Level 5</h5>
<h6>This is the Heading Level 6</h6>
</body>
</html>
·        Write html program to insert image into webpage.
Image.html
<html>
<head>
<title>Image Tag</title>
</head>
<body bgcolor=pink text=blue>
<img src="C:\Users\Public\Pictures\Sample Pictures\Lighthouse.jpg" height=400 width=400 border=3 hspace=20 vspace=20>
</body>
</html>
·        Write html program to insert table into webpage.
Table.html
<html>
<head>
<title>Table Example</title>
</head>
<body>
<Caption align="center">Table Heading</Caption>
<table border=2 align="center" height=200 width=300 cellspacing=7 cellpadding=10 bgcolor="yellow" bordercolor="red">
<tr>
<th> Monday </th>
<th> Tueday </th>
<th> Wednesday </th>
<th> Thursday </th>
</tr>
<tr>
<td> Chemistry </td>
<td> Physics</td>
<td> Biology </td>
<td> Mathematics </td>
</tr>
<tr>
<td> English </td>
<td> Marathi </td>
<td> I. T. </td>
<td> EVS </td>
</tr>
<tr>
<td> Geography </td>
<td> P. T. </td>
<td> Practical </td>
<td> Off Lecture</td>
</tr>
</table>
</body>
</html>
·        Write html program to demonstrate rowspan and colspan attributes of td tag.
Table1.html
<html>
<head>
<title></title>
</head>
<body>
<table border="1" width=400>
 <tr>
 <th colspan="4" scope="col">Work Contact Points</th>
 </tr>
 <tr>
 <th>Name</th>
 <th>Email</th>
 <th>Phone</th>
 <th>Floor/Block</th>
 </tr>
 <tr>
 <td>Bill</td>
 <td>bill@megacorp.com</td>
 <td>345678</td>
 <th rowspan="3">3/C</th>
 </tr>
 <tr>
 <td>Jane</td>
 <td>jane@megacorp.com</td>
 <td>777444</td>
 </tr>
 <tr>
 <td>Alison</td>
 <td>alison@megacorp</td>
 <td>888652</td>
 </tr>
</table>
<body>
</html>
Table2.html
<html>
<head>
<title>Table Example</title>
</head>
<body text=blue>
<table border=2 width=500 cellspacing=15 cellpadding=15 bgcolor=cream>
<tr>
<th>&nbsp;</th>
<th>&nbsp;</th>
<th>&nbsp;</th>
<th>Year Sales</th>
</tr>
<tr>
<th colspan=2>2009</th>
<th colspan=2>2010</th>
</tr>
<tr>
<td rowspan=3>Tools</td>
<td>Desc</td>
<td>Qty</td>
<td>Amount</td>
</tr>
<tr>
<td>PC</td>
<td>10</td>
<td>20</td>
</tr>
<tr>
<td>Laptop</td>
<td>20</td>
<td>30</td>
</tr>
</table>
</body>
</html>
·        Write html program to create hyperlink in a web page.
Link.html
<html>
<head>
<title></title>
</head>
<body>
<a href="Table.html">Same Folder</a><br>
<a href="C:\Users\Administrator\Desktop\navigator.html">Different Folder</a><br>
<a href="http://www.google.com">On Web</a>
</body>
</html>
·        Write html program to create hyperlink with its attributes in a web page.
Linkattr.html
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body link="red" alink="orange" vlink="green">
<p>Linking to document in same folder</p>
<a href=" Table.html " title="">Hyperlink1</a>
<p>Linking to document in Different folder</p>
<a href=" C:\Users\Administrator\Desktop\navigator.html " title="">Hyperlink2</a>
<p>Linking to document on the web</p>
<a href=" http://www.google.com " title="">Hyperlink3</a>
</body>
</html>
·        Write html program to create image as a hyperlink in a web page.
Hyperlink.html
<!DOCTYPE html>
<html>
<head>
<title>Image Hyperlink</title>
</head>
<body>
<a href="mypage.html"><img src="arrow.png" height="40" width="60" alt="Click on arrow"></a>
</body>
</html>
·        Write html program to create simple registration form.
Regform.html
<!DOCTYPE html>
<html>
<head>
<title>Registration Form</title>
</head>
<body>
<h1 align="center">Registration Form</h1>
<hr color="red">
<form name="myform">
Name : <input type="text"> <br><br>
Gender : Male <input type="radio" name="r1"> Female <input type="radio" name="r1"> <br><br>
Contact No : <input type="text"> <br><br>
Enter Password : <input type="password"> <br><br>
Confirm Password : <input type="password"> <br><br>
<input type="checkbox"> I agree the terms and Conditions. <br><br>
<input type="submit" value="Register"> <input type="reset" value="Clear">
</form>
</body>
</html>

0 comments:

Post a Comment