You are on page 1of 2

<!

DOCTYPE html>
<html>
<head>

<title>HW1 Temperature Convertion</title>

<script type="text/javascript" language="javascript">


function convert()
{
var C = document.getElementById('FarenCon').value;
var F = (C * 1.8) + 32;
document.getElementById('displ').innerText = `${C} Celsius = ${F} Fahrenheit`;
}

function convert1()
{
var F = document.getElementById('Celcon').value;
var C = (F - 32) * 0.5555555556;
document.getElementById('displ1').innerText = `${F} Fahrenheit = ${C} Celsius`
}
</script>

<style type="text/css">
p
{
font-size: 20px;
font-weight: bolder;
font-family:Consolas;

text-shadow: 1px 1px 4px black;


}

input
{
width: 200px;
border-radius: 7px;
box-shadow: 2px 2px 6px black;
margin: 20px;
}

button
{
border-radius: 10px;
height: 50px;
width: 100px;

font-size: 15px;
font-family:Courier New;
font-weight: bolder;
}
</style>

</head>
pp
<body>

<br><br><br>

<center>
<div>

<p>Convertion of Fahrenheit and Celsius</p>

</div>

</center>
<br><br><br>
<center>
<p>Celsius to Fahrenheit</p>
<input type="text" name="CeltoFar" id="FarenCon" placeholder="Enter the Value of Celsius">
<button onclick="convert()">Convert</button>
<p id="displ"></p>

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

<p>Fahrenheit to Celsius</p>
<input type="text" name="FartoCel" id="Celcon" placeholder="Enter the Value of Fahrenheit">
<button onclick="convert1()">Convert</button>
<p id="displ1"></p>

</center>

</body>

</html>

You might also like