Scribd
Upload
6 views12 pages

Experiment 1 66A1

The document outlines the development of a responsive web application for an online book store, featuring pages for registration, login, catalog, and shopping cart. It includes HTML code for each page, detailing the structure and elements such as forms for user input and book selection. The application aims to facilitate a seamless shopping experience for users, culminating in an order confirmation page.

Uploaded by

changalavalasrinidhi
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
6 views12 pages

Experiment 1 66A1

The document outlines the development of a responsive web application for an online book store, featuring pages for registration, login, catalog, and shopping cart. It includes HTML code for each page, detailing the structure and elements such as forms for user input and book selection. The application aims to facilitate a seamless shopping experience for users, culminating in an order confirmation page.

Uploaded by

changalavalasrinidhi
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 12

Experiment 1

Aim: Built a responsive web application for shopping cart with registration,login,catalog and cart
pages using CSS3 features flex and grid.

Shopping page html

<html>

<head>

<title>CS ONLINE BOOK STORE</title>

</head>

<body bgcolor="light green"><center>

<strong><h1>WELCOME TO CS ONLINE BOOK STORE</h1></strong>

<form method="post" action="loginpage.html" >

<h4>FOR BOOKS</h4><input type="submit" value="CLICK HERE">

</form>

</center>

</body>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<footer><h4>@ All Rights Are reserved by 24E11A66A1</h4></footer>

</html>

<style>

footer{text-align: right; text-align: bottom;color: red;}

</style>
Loginpage.html :

<html><head>

<title>login page</title>

</head>

<body bgcolor="light green"><center>

<strong><h1> CS ONLINE BOOK STORE </h1></strong></center>

<right>

<table align="center">

<tr>

<td><h4>User Name</td>

<td><input type="text" ></td>

<td></td>

</tr>

<tr>

<td><h4>Password</td>

<td><input type="password"></td>

<td></td>

</tr>

<tr>

<td>

<form method="post" action="catalog.html" >

<input type="submit" value="submit" >

</form>

</td>

<td>

<form method="post" action="userprofile.html" >

<input type="submit" value="register" >&nbsp;&nbsp;

<input type="reset" value="reset"></form></td>

</tr>

</table>

</body>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<footer>

<td></td>

<h4>@ All Rights Are reserved by 24E11A66A1</h4>

</footer>

<style>

footer{text-align: right; text-align: bottom;color: red;}

</style>

</html>
Userprofile.html :

<html><head>

<title>login page</title>

</head>

<body bgcolor="light green">

<center><strong><h1> CS ONLINE BOOK STORE </h1></strong></center>

<form method="post" action="catalog.html" ><right>

<table align="center">

<tr>

<td><h4>User Name</td>

<td><input type="text" ></td>

<tr>

<tr>

<td><h4>Password</td>

<td><input type="password"></td>

</tr>

<tr>

<td><h4>Confirm Password</td>

<td><input type="password"></td>

</tr>

<tr>

<td><h4>Gender&nbsp;&nbsp;

Male&nbsp; &nbsp;<input type="radio" name="Gender" value="Male"></td>

<td><h4>Female &nbsp; &nbsp;

<input type="radio" name="Gender" value="Female">

</td>

</tr>

<tr>

<td><h4>Address</h4></td>

<td><textarea name="address" rows=5 cols=19>

</textarea>
</td>

<tr>

<td>

<input type="submit" value="Submit" ></td>

<td>

<input type="reset" value="Reset"></td>

</tr>

</form>

</table>

</body>

<br><br><br><br><br><br><br><br><br><br><br><br><br>

<footer>

<td></td>

<h4>@ All Rights Are reserved by 24E11A66A1</h4>

</footer>

<style>

footer{text-align: right; text-align: bottom;color: red;}

</style>

</html>
Catalog.html:

<html><head>

<title> BOOKS CATALOG</title>

</head>

<body bgcolor="light green">

<center><h1>CS ONLINE BOOK STORE</h1></center>

<form method="post" action="quantity.html">

<left>

<table>

<tr>

<td><b><h3>Matrices and Vectors</td>

<td></td></tr>

<tr>

<td></td>

<td><h4>Engineering Chemistry</td>

</tr>

<tr>

<td></td>

<td><h4>Engineering Physics</td>

</tr>

<tr>

<td></td>

<td><h4>Computer Aided Graphics</td>

</tr>

<tr>

<td><b><h3>EDC</td>

<td></td>

</tr>

<tr>

<td></td>

<td><h4>BEE</td>
</tr>

<tr>

<td></td>

<td><h4>ENGLISH</td>

</tr>

<tr>

<td></td>

<td><h4>ENVIRONMENTAL SCIENCE </td>

</tr>

</table>

</h4>

<center>

<b>TO BUY THESE BOOKS

<br>

</b><input type="submit" value="Click Here">

</center>

</form>

</body>

<br><br><br><br><br><br><br>

<footer>

<td></td>

<h4>@ All Rights Are reserved by 24E11A66A1</h4>

</footer>

<style>

footer{text-align: right; text-align: bottom;color: red;}

</style>

</html>
Quantity.html:

<html>

<head><title>SHOPPING CART</title>

</head>

<body bgcolor="light green">

<center><h1>SHOPPING CART</h1></center>

<br><br><br><br><br>

<table align="center">

<tr>

<td>TEXT BOOKS</td>

<td>

<select >

<optgroup label="SELECT BOOK">

<option value=" Matrices and Vectors "> MATRICES AND VECTORS

<option value=" Engineering Chemistry ">ENGINEERING CHEMISTRY

<option value=" Engineering Physics ">ENGINEERING PHYSICS

<option value=" Computer Aided Graphics ">COMPUTER AIDED GRAPHICS

<option value=" EDC ">EDC

<option value="BEE">BEE

<option value="ENVIRONMENTAL SCIENCE">ENVIRONMENTAL SCIENCE</optgroup>

</select>

</td></tr>

<tr>

<td> QUANTITY</td>

<td>

<input type="text" id="q">

</td></tr>

<tr>

<td></td>

<td>

<form method=post action="payment.html">


<input type="submit" value=OK />

</form>

</td></tr>

</table>

<center>

<pre>COST OF ONE BOOK IS "500" + SHIPPING "100"</pre>

</center>

</body>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<footer>

<td></td>

<h4>@ All Rights Are reserved by 24E11A66A1</h4>

</footer>

<style>

footer{text-align: right; text-align: bottom;color: red;}

</style>

</html>
Payment.html:

<html>

<head><title>PAYMENT</title></head>

<body bgcolor="light green">

<center><h1>PAYMENT BY CREDIT CARD</h1></center>

<form method=post action="orderconfirm.html">

<br><br><br><br><br>

<table align="center">

<tr>

<td>

<h4>Total Amount</h4></td>

<td><input type="text">

</td>

</tr>

<tr>

<td><h4>Credit Card Number</td>

<td><input type="password"></td>

</tr>

<tr>

<td>

</td>

<td><input type="submit" value=OK>

</td>

</tr>

</table>

</form>

</body>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<footer>

<td></td>

<h4>@ All Rights Are reserved by 24E11A66A1</h4>


</footer>

<style>

footer{text-align: right; text-align: bottom;color: red;}

</style>

</html>
Orderconfirm.html:

<html>

<head><title>ORDER CONFIRMATION</title><M/head>

<body bgcolor="light blue">

<center>

<h1><b>CS ONLINE BOOK STORE</h1>

<pre><strong>

<b>Your order Is Confirmed

</strong></pre>

<h2><b>THANK YOU</h2>

</center>

</body>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<footer>

<td></td>

<h4>@ All Rights Are reserved by 24E11A66A1</h4>

</footer>

<style>

footer{text-align: right; text-align: bottom;color: red;}

</style>

</html>

You might also like