Change the inline style to internal (embedded) CSS. Fix any issues or calculatio
ID: 3720626 • Letter: C
Question
Change the inline style to internal (embedded) CSS.
Fix any issues or calculations.
<!DOCTYPE>
<html>
<head><title>SHIPPING PROBLEM2</title>
</head>
<script type="text/javascript">
function regular()
{
shipping.value=0;
total.value=price.value;
}
function express()
{
shipping.value=2.00;
total.value=parseDouble(price.value) +parseDouble(shippingcost.value);
}
function overnight()
{
shiping.value=10;
total.value=parseDouble(price.value) +parseDouble(shippingcost.value);
}
</script>
<body>
<form>
<table>
<th colspan="2">SHIPPING</th>
<tr> <td><label>Cart Price:</label></td><td> <input type="text" id='price' /> </td> </tr>
<tr> <td><label>Shipping:</label></td><td> <input type="text" id='shippingcost' readonly/> </td> </tr>
<tr> <td><label>Total:</label></td> <td> <input type="text" id='total' readonly/> </td> </tr>
<tr>
<td colspan="2" >
<input type="button" value="REGULAR" />
<input type="button" value="EXPRESS" />
<input type="button" value="OVERNIGHT" />
<input type="button" value="CLEAR" />
</td>
</tr>
</table>
</form>
</body>
</html>
Explanation / Answer
<!DOCTYPE>
<html>
<head><title>SHIPPING PROBLEM2</title>
</head>
<script type="text/javascript">
function regular()
{
document.getElementById("total").value = price.value;
}
function express()
{
var shipping = 2.00;
document.getElementById("total").value = parseDouble(price.value) +parseDouble(shippingcost);
}
function overnight()
{
var shiping =10;
document.getElementById("total").value = parseDouble(price.value) +parseDouble(shippingcost);
}
</script>
<style type="text/css">
table{
color:black;background-color:orange;border:solid black 6px;border-width:4px;
}
th{
color:white;background-color:black;outline-style:solid;outline-width:2px;border:2px solid black;
}
#price{
background-color:#DEDEE6;border:4px solid black;
}
#shippingcost{
background-color:#DEDEE6;border:4px solid black;
}
#total{
background-color:#DEDEE6;border:4px solid black;
}
#regularID{
color:black;background-color:white;border:1px solid white;
}
#expressID{
color:blue;background-color:white;border:1px solid white;
}
#overnightID{
color:orange;background-color:black;border:1px solid white;
}
#clear{
color:white;background-color:black;border:1px solid white;
}
</style>
<body>
<form>
<table>
<th colspan="2">SHIPPING</th>
<tr> <td><label>Cart Price:</label></td><td> <input type="text" id='price'/> </td> </tr>
<tr> <td><label>Shipping:</label></td><td> <input type="text" id='shippingcost'/> </td> </tr>
<tr> <td><label>Total:</label></td> <td> <input type="text" id='total' readonly/> </td> </tr>
<tr>
<td colspan="2" >
<input type="button" value="REGULAR" id="regularID" />
<input type="button" value="EXPRESS" id="expressID" />
<input type="button" value="OVERNIGHT" id="overnightID" />
<input type="button" value="CLEAR" id="clear" />
</td>
</tr>
</table>
</form>
</body>
</html>
**Comment for any further queries.
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.