EXAM01 C18385 Web Programming NAME: USERID: 1. Create the following form. Must u
ID: 3723708 • Letter: E
Question
EXAM01 C18385 Web Programming NAME: USERID: 1. Create the following form. Must use a table to align the elementsr CIRCLE PROBLEM Radius: Area: Circumference Calc Area Calc Circumference Calc Both Clear All Output File: examlpl.html 2. Create the following form. Must use a table to align the elements: ITEM SHOPPING Item Name: UHD MONITOR Item Price: $399 olor o Red o White uantity: ADD2CART CLEAR Output File: exam1p2.htm1 3. Copy the form from 1 into the PROBLEM1 HERE cell and the form from #2 into PROBLEM2 HERE in the newboth2.html. OFD ROBLEM1 HERE PROBLEM2 HERE Input File: newboth2.html, examlpl.html, examlp2.html Output File: examlp3.html HOW TO DELIVER: FTP the examlpl.html, examlp2.html and examlp3.html into your virtual lab (69.203.99.47) account, under a folder called examlExplanation / Answer
examp1.html
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
table{
border:none;
margin:auto;
}
.circle{
width:95%;
height:100%;
border-radius:50%;
padding:5px;
background:#000;
color:#fff;
margin:2px;
}
.prob3{
border:5px solid #000;
}
.prob3 div.center{
width:0px;
height:30px;
}
</style>
</head>
<body>
<table border="1px">
<tr><th colspan="2">CIRCLE PROBLEM</th></tr>
<tr><td>Radius:</td><td><input type="text" /></td></tr>
<tr><td>Area:</td><td><input type="text" /></td></tr>
<tr><td>Circumference:</td><td><input type="text" /></td></tr>
<tr><td colspan="2"><button>Calc Area</button><button>Calc Circumfernce</button><button>Calc Both</button><button>Clear All</button></td></tr>
</table>
</body>
</html>
examp2.html
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
table{
border:none;
margin:auto;
}
.circle{
width:95%;
height:100%;
border-radius:50%;
padding:5px;
background:#000;
color:#fff;
margin:2px;
}
.prob3{
border:5px solid #000;
}
.prob3 div.center{
width:0px;
height:30px;
}
</style>
</head>
<body>
<table border="1px">
<tr><th colspan="2">ITEM SHOPPING</th></tr>
<tr><td>Item Name:</td><td><input type="text" value="UHD MONITOR"/></td></tr>
<tr><td>Item Price:</td><td><input type="text" value="$399"/></td></tr>
<tr><td>Color:</td><td><input type="radio" checked="true"/> Red <input type="radio"/> White</td></tr>
<tr><td colspan="2" align="center"><button>ADD2CART </button><button>CLEAR</button></td></tr>
</table>
</body>
</html>
//newboth2.html
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
table{
border:none;
margin:auto;
}
.circle{
width:95%;
height:100%;
border-radius:50%;
padding:5px;
background:#000;
color:#fff;
margin:2px;
}
.prob3{
border:5px solid #000;
}
.prob3 div.center{
width:0px;
height:30px;
}
</style>
</head>
<body>
<table class="prob3">
<tr><td colspan="3"><div class="circle" ></div></td></tr>
<tr>
<td>
<table border="1px">
<tr><th colspan="2">CIRCLE PROBLEM</th></tr>
<tr><td>Radius:</td><td><input type="text" /></td></tr>
<tr><td>Area:</td><td><input type="text" /></td></tr>
<tr><td>Circumference:</td><td><input type="text" /></td></tr>
<tr><td colspan="2"><button>Calc Area</button><button>Calc Circumfernce</button><button>Calc Both</button><button>Clear All</button></td></tr>
</table>
</td>
<td><div class="circle center"></div> </td>
<td>
<table border="1px">
<tr><th colspan="2">CIRCLE PROBLEM</th></tr>
<tr><td>Radius:</td><td><input type="text" /></td></tr>
<tr><td>Area:</td><td><input type="text" /></td></tr>
<tr><td>Circumference:</td><td><input type="text" /></td></tr>
<tr><td colspan="2"><button>Calc Area</button><button>Calc Circumfernce</button><button>Calc Both</button><button>Clear All</button></td></tr>
</table>
</td>
</tr>
<tr><td colspan="3"><div class="circle" ></div></td></tr>
</table>
</body>
</html>
examp3.html
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
table{
border:none;
margin:auto;
}
.circle{
width:95%;
height:100%;
border-radius:50%;
padding:5px;
background:#000;
color:#fff;
margin:2px;
}
.prob3{
border:5px solid #000;
}
.prob3 div.center{
width:0px;
height:30px;
}
</style>
</head>
<body>
<table class="prob3">
<tr><td colspan="3"><div class="circle" ></div></td></tr>
<tr>
<td><a class="circle" href="examp1.html">PROBLEM1 HERE</a></td>
<td><div class="circle center"></div> </td>
<td><a class="circle" href="" href="examp2.html">PROBLEM2 HERE</a></td>
</tr>
<tr><td colspan="3"><div class="circle" ></div></td></tr>
</table>
</body>
</html>
Related Questions
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.