HTML Code of Temperature Converter:
Temperature Converter HTML code-
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, intial-scale=1">
<title>Temperature Converter by Devansh</title>
<style>
h2{
text-align:center;
}
div{
text-align:center;
background-color:lightgreen;
padding:10px 5px;
}
.input-div{
display:inline-block;
}
.inp{
padding:5px 10px;
margin:5px;
font-weight:bold;
font-size:15px;
width:250px;
text-align:center;
}
label{
font-size:17px;
}
p{
border:2px solid green;
border-radius:10px;
padding:5px 5px;
text-align:center;
color:yellow;
background-color:red;
}
</style>
</head>
<body>
<h2> Temperature Converter </h2>
<div id="container">
<div class="input-div">
<label> Celsius </label> <br>
<input type="number" value="0" id="cel" class="inp">
</div>
<div class="input-div">
<label> Fahrenheit </label> <br>
<input type="number" value="32" id="fah" class="inp">
</div>
</div>
<p> PROGRAMMED BY DEVANSH MISHRA. </p>
<script>
var cel = document .getElementById("cel");
var fah = document .getElementById("fah");
cel .addEventListener("input" , function ( ){
let c = this .value;
let f = (c * 9/5) + 32;
if(! Number .isInteger(f) ){
f = f .toFixed(4);
}
fah .value = f;
});
fah .addEventListener ( "input" , function( ){
let f = this .value;
let c = (f - 32) * 5/9;
if( !Number .isInteger(c) ){
c = c .toFixed(4);
}
cel .value = c;
});
</script>
</body>
</html>