Scribd
Upload
34 views

Web Tech Lab Code

Uploaded by

wtyds2468
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
34 views

Web Tech Lab Code

Uploaded by

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

loginpage.

html
<!DOCTYPE html>
<html>
<head></head>
<body>
<h1 align="center">LOGIN</h1>
<form method="post">
<table align="center" cellspacing="10">
<tr><td><b>User ID</b></td><td><input name="uid" type="text"></td></tr>
<tr><td><b>Password</b></td><td><input name="pwd" type="password"></td></tr>

<tr><tdcolspan="2" align="center">
<input type="button" value="Login"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="reset"></td></tr>

<tr><td colspan="2" align="right"><i><a href="regpage.html">New User Click


Here</a></i></td></tr></table>

</form>
</body>
</html>

regpage.html
<!DOCTYPE html>
<html>
<head></head>
<body>
<form>
<h1 align="center"> REGISTRATION </h1>
<table align="center" cellspacing="10">
<tr><td>Name::</td><td> <input name="uname" type="text"> </td></tr>
<tr><td>Password::</td><td> <input name="pwd" type="password"> </td></tr>
<tr><td> E-mail ID:: </td><td> <input name="email" type="text"> </td></tr>
<tr><td> Phone Number:: </td><td> <input name="phno" type="text"
maxlength="10"></td></tr>
<tr><td> Gender:: </td><td><input name="gender" type="radio"
value="Male">&nbsp;&nbsp;Male&nbsp;&nbsp;&nbsp;&nbsp;<input name="gender"
type="radio" value="Female">&nbsp;&nbsp;Female</td></tr>
<tr><td> Date of Birth </td><td><select name="date"><option>--Date--</option>
<option>01</option><option>02</option><option>03</option><option>04</option><o
ption>05</option><option>06</option><option>07</option><option>08</option><opti
on>09</option><option>10</option><option>11</option><option>12</option><option
>13</option><option>14</option><option>15</option><option>16</option><option>1
7</option><option>18</option><option>19</option><option>20</option><option>21</
option><option>22</option><option>23</option><option>24</option><option>25</opt
ion><option>26</option><option>27</option><option>28</option><option>29</option
><option>30</option><option>31</option>
</select>&nbsp;&nbsp;&nbsp;
<select name="month">
<option>--MONTH--</option>
<option>JAN</option><option>FEB</option><option>MAR</option><option>APR</o
ption><option>MAY</option><option>JUN</option><option>JUL</option><option>A
UG</option><option>SEP</option><option>OCT</option><option>NOV</option><op
tion>DEC</option>
</select>&nbsp;&nbsp;&nbsp;
<select name="year">
<option>--YEAR--</option>
<option>1980</option><option>1981</option><option>1982</option><option>1983</o
ption><option>1984</option><option>1985</option><option>1986</option><option>1
987</option><option>1988</option><option>1989</option><option>1990</option><op
tion>1991</option><option>1992</option><option>1993</option><option>1994</optio
n><option>1995</option><option>1996</option><option>1997</option><option>1998
</option><option>1999</option>
<option>2000</option>
</select>
</td></tr>
<tr><tdvalign="top">Languages Known::</td><td>
<input name="lk" type="checkbox" value="English">&nbsp;English<br>
<input name="lk" type="checkbox" value="Telugu">&nbsp;Telugu<br>

<input name="lk" type="checkbox" value="Hindi">&nbsp;Hindi<br>

<input name="lk" type="checkbox" value="Tamil">&nbsp;Tamil<br> </td></tr>


<tr><td>Address</td><td><textarea></textarea></td></tr>
<tr><td colspan=“2” align=“center”> <input type=“submit”
value=“Register”>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type=“reset” value=“Cancel”> </td></tr>
</table>
</form>
</body>
</html>
Catpage.html
<html>
<head></head>
<body>
<form>
<table cellspacing=“10”>
<tr><td><img src=“images/html5.jpg” width=“100” height=“100”></td>
<td> Title : HTML5 and CSS3 <br> Author : Sasha Vodnik <br> </td>
<td>Rs. 700 /- </td>
<td><input type=“image” src=“images/add to cart.jpg” width=“150”
height=“100”></td></tr>

<tr><td><img src=“images/php.jpg” width=“100” height=“100”></td>


<td> Title : PHP and MYSQL <br> Author : W. Jason Gilmore <br> </td>
<td>Rs. 650 /- </td>
<td><input type=“image” src=“images/add to cart.jpg” width=“150”
height="100"></td></tr>

<tr><td><img src="images/j2ee.jpg" width="100" height="100"></td>


<td> Title : The Complete Reference JAVA 2 <br>
Author : Herbert Schildt <br> </td><td>Rs. 850 /- </td>
<td><input type="image" src="images/add to cart.jpg" width="150"
height="100"></td></tr>
</table>
</form>
</body>
</html>

course.html
<!DOCTYPE html>
<html>
<head></head>
<body>
<ul><li>B.Tech.</li><li>M.Tech.</li><li>MBA</li><li>MCA</li><li>
Polytechnic</li>
</ul>
</body>
</html>
Cartpage.html
<!DOCTYPE html>
<html>
<head>
<meta charset=“utf-8”>
<meta name=“viewport” content=“width=device-width, initial-scale=1”>
<title></title>
</head>
<body>
<h1 align=“center”>Shopping Cart</h1>
<form>
<table align="center" cellpadding="20px">
<tr><th>Product</th><th>Description</th><th>Price</th>
<th>Quantity</th><th>Subtotal</th></tr>

<tr><td><img src="images/html5.jpg" width="100" height="100" /></td>


<td>Title : HTML5 and CSS3 <br>Author : Sasha Vodnik</td>
<td>Rs. 700 /-</td>
<td><input type="text" size="2" value="1" readonly /></td>
<td>Rs. 700 /-</td></tr>

<tr><td><img src="images/php.jpg" width="100" height="100" /></td>


<td>Title : PHP and MYSQL <br>Author : W. Jason Gilmore </td>
<td>Rs. 650 /- </td>
<td><input type="text" size="2" value="1" readonly /></td>
<td>Rs. 650 /- </td></tr>

<tr><th colspan="2">Promotion Code</td><th colspan="3">Cart Totals</td></tr>

<tr><tdcolspan="2"><input type="text" placeholder="Coupon code" /> &nbsp;


<input type="button" value="Apply Coupon" /></td>
<th colspan="2">Subtotal</th><td>Rs. 1350 /-</td></tr>

<tr><td colspan="2"></td><th colspan="2">Total</th><th>Rs. 1350 /-</th></tr>


<tr><td colspan=“5” align=“right”><input type=“button” value=“Proceed to
Checkout”/></td></tr>
</table>
</form>
</body>
</html>
PaymentGateway.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Payment Gateway</title>
</head>
<body>
<h1 align="center">Credit Card Payment Gateway</h1><hr>
<form><table align="center" cellpadding="20px">
<tr><td colspan="2" align="center"><h2>Payment Details</h2></td></tr>
<tr><td colspan="2"><b>CARD NUMBER</b><br>
<input type="text" placeholder="Valid Card Number" size="52" /></td></tr>
<tr><td><b>Expire Date</b><br><input type="text" placeholder="MM/YY" /></td>
<td><b>CV Code</b><br><input type="text" placeholder="CVV" /></td></tr>
<tr><td colspan="2"><b>CARD OWNER</b><br>
<input type=“text” placeholder=“Card Owner Name” size=“52” /></td></tr>
<tr><td colspan=“2” align=“center”>
<input type=“button” value=“Confirm Payment”></td></tr></table>
</form>
</body>
</html>

homepage.html
<!DOCTYPE html>
<html>
<head></head>
<body>
<b>Welcome to Online Book Store</b>
<p> Here you find all types of books, magazines and national and international journals.</p>
</body>
</html>
<body>
<h1> Calculator Program in JavaScript </h1>
<div class= "formstyle">
<form name = "form1">
<input class= "textview" name = "textview">
</form>
<center>
<table >
<tr>
<td> <input class = "btn" type = "button" value = "C" onclick = "form1.textview.value = ' ' " >
</td>
<td> <input class = "btn" type = "button" value = "B" onclick = "backspace()" > </td>
<td> <input class = "btn" type = "button" value = "/" onclick = "insert('/')" > </td>
<td> <input class = "btn" type = "button" value = "x" onclick = "insert('*')" > </td>
</tr>
<tr>
<td> <input class = “btn” type = “button” value = “7” onclick = “insert(7)” > </td>
<td> <input class = “btn” type = “button” value = “8” onclick = “insert(8)” > </td>
<td> <input class = “btn” type = “button” value = “9” onclick = “insert(9)” > </td>
<td> <input class = “btn” type = “button” value = “-” onclick = “insert(‘-’)” > </td>
</tr>
<tr>
<td> <input class = “btn” type = “button” value = “4” onclick = “insert(4)” > </td>
<td> <input class = “btn” type = “button” value = “5” onclick = “insert(5)” > </td>
<td> <input class = “btn” type = “button” value = “6” onclick = “insert(6)” > </td>
<td> <input class = “btn” type = “button” value = “+” onclick = “insert(‘+’)” >
</td>
</tr>
<tr>
<td> <input class = “btn” type = “button” value = “1” onclick = “insert(1)” > </td>
<td> <input class = “btn” type = “button” value = “2” onclick = “insert(2)” > </td>
<td> <input class = “btn” type = “button” value = “3” onclick = “insert(3)” > </td>
<td rowspan = 5> <input class = “btn” style = “height: 110px” type = “button” value = “=“ onclick
= “equal()”> </td>
</tr>
<tr>
<td colspan = 2> <input class = “btn” style = “width: 106px” type = “button” value
= “0” onclick = “insert(0)” > </td>
<td> <input class = “btn” type = “button” value = “.” onclick = “insert(‘.’)”> </td>
</tr>
</table>
</center>
</div>
</body>
</html>
UNIT- 06
Example: Demonstration of inline style sheet

<html>
<head>
<title> Inline CSS</title>
<meta http-equiv="content-style-type" content="text/css">
</head>
<body style="background:orange">
<h1 style="color:White; font-family:arial; font-size:14pt; text-transform:uppercase;
text-align:left;”> This is an example of inline css</h1>
</body>
</html>
Example 1: Demonstration of embedded style sheet

<!DOCTYPE html>
<html>
<head>
<title> Embedded CSS</title>
<style type="text/CSS">
body { background-color:#ccffff; }
h1 { color: purple; font-family: arial; font-size: 30 px; text-transform: uppercase;
text-align: left;}
</style>
</head>
<body>
<h1> This is an example of embedded CSS</h1>
<h1> B E </h1>
</body>
</html>
Example 2: Demonstration of embedded style sheet

<!DOCTYPE html>
<html>
<head>
<title> Embedded CSS</title>
<style type="text/CSS"> body {
background-color:#ccffff;
}
h1 { color: purple; font-family: arial; font-size: 30 px; text-transform:
uppercase; text-align: left;}
</style>
</head>
<body>
<h1>Computer programming languages</h1>
<table border=“1”>
<tr><th>Web-tech</th><th>Object-Oriented</th></tr>
<tr><td>CSS</td><td>java</td></tr>
</table>
<p>Embedded CSS is better than Inline CSS</p>
</body>
</html>
Example: Demonstration of external style sheet

NOTE: Save following program as external.css


body { background:#ccffff;}
h2,p { color: green; font-family:arial; text-align:center; }
p i{ color: orange; border-style: solid; font-weight: lighter; }
.ex{color:purple}

NOTE: Save following program as external.html and link above CSS file in it.
<html>
<head><title>Extenal style sheet</title>
<link rel= "stylesheet" type= "text/CSS" href="external.css">
</head>
<body>
<h2> It is an example of External style sheet</h2>
<p class="ex"> This is a "true separation" of style and content</p>
<p><i> External CSS </i> </p>
</body>
</html>

You might also like