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

Web Tech Lab Code

Uploaded by

wtyds2468
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
43 views

Web Tech Lab Code

Uploaded by

wtyds2468
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
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