1. Regular track: Write an online store website (typically online store) with HT
ID: 3577048 • Letter: 1
Question
1. Regular track: Write an online store website (typically online store) with HTML, CSS, and PHP using WebMatrix.
HTML forms are required.
The website must contain dynamic content.
PHD must be used to generate dynamic content. The minimum line count for PHD is 100 nontrivial lines.
The website must have more than three commodities for sale. Must have one page for commodity selection.
Must have one page for placing order.
Must have one page for credit card payment and finalizing purchase.
The credit card payment page does not need implement real card transaction, just getting input of card information would be enough.
Must have a readme file to show the general design or algorithm of your project (website).
We have not covered cookies yet, using cookies is optional, not required.
Explanation / Answer
login.html
.............
<html>
<head>
<title>Login Form Submission</title>
</head>
<body background="C:WINDOWSBACKGRND.GIF">
<form action="Login" method=Post>
<p align="left">
<div align="center">
<center>
<table border="0" cellpadding="0" cellspacing="0" width="663" height="73" bgcolor="#800000">
<tr>
<td width="663" height="73"> <font size="7" face="Lucida Handwriting"><b><i>
login form</i></b></font></td>
</tr>
</table>
</center>
</div>
<p align="center">
<p><font color="#800000" size="5"><b>L</b></font><font color="#800000" size="5"><b>ogin
Form Submission</b></font></p>
<hr color="#800000">
<h2> </h2>
<p><b>Enter username : <b> <input type="text" size="25" maxlength="256" name="Username"><br>
<br>
<br>
<b>Enter password :</b> <input type="password" size="25" maxlength="256" name="Password"><strong><br>
</strong></p>
<p><strong><br>
</strong><input type="submit" value="Register Me"> <input type="reset" value="Clear Form"></p>
</form>
<p> </p>
<hr color="#800000">
<h5>Author information goes here.<br>
Copyright © 1999 [<font color="#800000"><b><i>wepShop.com</i></b></font>]. All
rights reserved.<br>
Revised: June 08, 2001
.</h5>
</body>
</html>
Body
{margin-bottom:0px;
margin-top:0px;
margin-left:0px;
margin-right:0px;
background-color:#181818;
font: normal small Arial, Helvetica, sans-serif;
color:#6B6B6B;
}
.bg
{background-image:url( images/bg.gif); background-repeat:repeat-x;
}
.topmenu{
text-transform:uppercase;
font-size:11px;
color:#969696;
text-decoration:none;
}
.topmenu:hover{
text-transform:uppercase;
font-size:11px;
color:#FFFFFF;
text-decoration:none;
}
.logo{
text-transform: uppercase;
font-size:28px;
color:#B0B0B0;
font-weight:bold;
padding-left:15px;
text-decoration:none;
}
.tag {
text-transform: uppercase;
font-size:16px;
font-weight:bold;
color:#8E8E8E;
padding-left:15px;
text-decoration:none;
}
.rc1
{background-image:url( images/rc1.gif); background-repeat:no-repeat;
width:25px;
height:40px;
background-color:#393838;
}
.rc2
{background-image:url( images/rc2.gif); background-repeat:no-repeat;
width:7px;
height:46px;
}
.rc3
{background-image:url( images/rc3.gif); background-repeat:no-repeat;
width:7px;
height:46px;
}
.sap
{background-image:url( images/sap.gif); background-repeat:no-repeat;
width:9px;
height:46px;
}
.rc4
{background-image:url( images/rc4.gif); background-repeat:no-repeat;
width:8px;
height:8px;
}
.rc5
{background-image:url( images/rc5.gif); background-repeat:no-repeat;
width:8px;
height:8px;
}
.rc6
{background-image:url( images/rc6.gif); background-repeat:no-repeat;
width:8px;
height:8px;
}
.rc7
{background-image:url( images/rc7.gif); background-repeat:no-repeat;
width:8px;
height:8px;
}
.bullet
{background-image:url( images/bullet.gif); background-repeat:no-repeat;
width:17px;
height:17px;
}
.topbg
{background-image:url( images/top_bg.gif); background-repeat:repeat-x;
}
.leftbg
{background-image:url( images/left_bg.gif); background-repeat:repeat-y;
}
.rightbg
{background-image:url( images/right_bg.gif); background-repeat:repeat-y;
}
.bottombg
{background-image:url( images/bottom_bg.gif); background-repeat:repeat-x;
}
.linksbg
{background-image:url( images/links_bg.gif); background-repeat:repeat-x;
}
.toplinks{
text-transform:uppercase;
font-size:13px;
color:#FFFFFF;
font-weight:bold;
text-decoration:none;
}
.toplinks:hover{
text-transform:uppercase;
font-size:13px;
color:#000000;
font-weight:bold;
text-decoration:none;
}
.bullettext
{font-family:tahoma;
font-size:11px;
font-weight:bold;
color:#ffffff;
text-decoration:none;
}
.quicklinks{
color:#686868;
padding-left:10px;
text-decoration:underline;
}
.quicklinks:hover{
color:#686868;
padding-left:10px;
text-decoration:none;
}
.footerlinks{
color:#989898;
padding-left:10px;
text-decoration:none;
}
.footerlinks:hover{
color:#ffffff;
padding-left:10px;
text-decoration:none;
}
.boxtitle {
height: 29px;
padding-bottom:6px;
font-size:14px;
font-weight:bold;
color: #393838;
}
.heading {
text-transform: uppercase;
font-size:16px;
padding-top:10px;
font-weight:bold;
color: #393838;
height:30px;
}
.dommeimage
{width:100px;
height:100px;
background-color:#DDDDDD;
border:1px dotted #000000;
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Jewelry Shop Design Template by CMG Technologies</title>
<link href="jewelry_store.css" rel="stylesheet" type="text/css" />
<script language="JavaScript1.1">
<!--
var slideimages=new Array()
var slidelinks=new Array()
function slideshowimages(){
for (i=0;i<slideshowimages.arguments.length;i++){
slideimages[i]=new Image()
slideimages[i].src=slideshowimages.arguments[i]
}
}
function slideshowlinks(){
for (i=0;i<slideshowlinks.arguments.length;i++)
slidelinks[i]=slideshowlinks.arguments[i]
}
function gotoshow(){
if (!window.winslide||winslide.closed)
winslide=window.open(slidelinks[whichlink])
else
winslide.location=slidelinks[whichlink]
winslide.focus()
}
//-->
</script>
</head>
<body>
<table width="779" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><table width="100%" border="0" align="right" cellpadding="0" cellspacing="0">
<tr>
<td class="rc1"></td>
<td bgcolor="#393838"><table width="220" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="images/img04.gif" alt="Home" width="11" height="10" /></td>
<td><a href="index.html" class="topmenu">Home</a></td>
<td><a href="logosign.html" class="topmenu">Customer Login</a></td>
<td><a href="AdminLogin.html" class="topmenu">Admin Login</a></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
<tr>
<td height="50"></td>
</tr>
<tr>
<td><a href="index.html" class="logo">Jewellery Mall </a></td>
</tr>
</table></td>
<td width="270" class="bg"><img src="images/ring.jpg" alt="Ring" /></td>
</tr>
</table></td>
</tr>
<tr>
<td height="46" bgcolor="#393838"><table width="90%" border="0" align="center" cellpadding="0" cellspacing="0" class="linksbg">
<tr>
<td class="rc2"></td>
<td align="center"><a href="index.html" class="toplinks">About us</a></td>
<td class="sap"></td>
<td align="center"><a href="index.html" class="toplinks">Products</a></td>
<td class="sap"></td>
<td align="center"><a href="index.html" class="toplinks">services</a></td>
<td class="sap"></td>
<td align="center"><a href="index.html" class="toplinks">contact</a></td>
<td class="sap"></td>
<td align="center"><a href="index.html" class="toplinks">sitemap</a></td>
<td class="rc3"></td>
</tr>
</table>
<div>
<a href="#"><img src="1.jpg" name="slide" border=0 width=350 height=250 align="center"></a>
<script>
<!--
//configure the paths of the images, plus corresponding target links
slideshowimages("1.jpg","2.jpg","3.jpg","4.jpg","5.jpg")
//configure the speed of the slideshow, in miliseconds
var slideshowspeed=1000
var whichlink=0
var whichimage=0
function slideit(){
if (!document.images)
return
document.images.slide.src=slideimages[whichimage].src
whichlink=whichimage
if (whichimage<slideimages.length-1)
whichimage++
else
whichimage=0
setTimeout("slideit()",slideshowspeed)
}
slideit()
//-->
</script>
</align>
</div>
</body>
</html>
<html>
<head>
<script language="JavaScript1.1">
<!--
var slideimages=new Array()
var slidelinks=new Array()
function slideshowimages(){
for (i=0;i<slideshowimages.arguments.length;i++){
slideimages[i]=new Image()
slideimages[i].src=slideshowimages.arguments[i]
}
}
function slideshowlinks(){
for (i=0;i<slideshowlinks.arguments.length;i++)
slidelinks[i]=slideshowlinks.arguments[i]
}
function gotoshow(){
if (!window.winslide||winslide.closed)
winslide=window.open(slidelinks[whichlink])
else
winslide.location=slidelinks[whichlink]
winslide.focus()
}
//-->
</script>
</head>
<body background="BGground.jpg">
<br><br><br>
<a href="#"><img src="1.jpg" name="slide" border=0 width=350 height=250 align="center"></a>
<script>
<!--
//configure the paths of the images, plus corresponding target links
slideshowimages("1.jpg","2.jpg","3.jpg","4.jpg","5.jpg")
//configure the speed of the slideshow, in miliseconds
var slideshowspeed=1000
var whichlink=0
var whichimage=0
function slideit(){
if (!document.images)
return
document.images.slide.src=slideimages[whichimage].src
whichlink=whichimage
if (whichimage<slideimages.length-1)
whichimage++
else
whichimage=0
setTimeout("slideit()",slideshowspeed)
}
slideit()
//-->
</script>
<br><br><br>
                     
   <a href="aboutus.html" ><b>About Us</b></a>
   <a href="help.html" ><b>Help!</b></a>
   <a href="contactus.html" ><b>Contact Us</b></a>
</align>
</body>
</html>
Project name:web shop
I have complete code its is not upload directly.i will send later
Related Questions
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.