html

html??hesapmakinei
<html>

<title>Untitled Document</title>
<style>

#btn {

      background-color: #e67e22;

    border: none;

    color: black;

    padding: 5px 32px;

    text-align: center;

    text-decoration: none;

    display: inline-block;

    font-size: 12px;

    margin: 4px 2px;

    cursor: pointer;
}
#btn2 {

      background-color: #e67e22;

    border: none;

    color: black;

    padding: 5px 32px;

    text-align: center;

    text-decoration: none;

    display: inline-block;

    font-size: 12px;

    margin: 4px 2px;

    cursor: pointer;
}
#btn3 {

      background-color: #e67e22;

    border: none;

    color: black;

    padding: 5px 32px;

    text-align: center;

    text-decoration: none;

    display: inline-block;

    font-size: 12px;

    margin: 4px 2px;

    cursor: pointer;
}
body
{
background-color: #FFDEE9;
background-image: linear-gradient(0deg, #FFDEE9 0%, #B5FFFC 100%);


}
</style>
</head>
<br><br><br><br>
<body><center><h1>TOPLAMA ALANI</h1>
<input placeholder="1.sayıyı girin" type="text" id="txtKenar1" />
<input placeholder="2.sayıyı girin" type="text" id="txtKenar2" />
<button id="btn">Hesapla</button>

<h1>ÇIKARTMA ALANI</h1>
<input placeholder="1.sayıyı girin" type="text" id="txtKenar12" />
<input placeholder="2.sayıyı girin" type="text" id="txtKenar32" />
<button id="btn2">Hesapla</button>
<div id="sonuc"></div>

<h1>BÖLME ALANI</h1>
<input placeholder="1.sayıyı girin" type="text" id="bolme" />
<input placeholder="2.sayıyı girin" type="text" id="bolme2" />
<button id="btn3">Hesapla</button>
<div id="sonuc2"></div>
<script>
function Hesapla()
{
	var k1=Number(document.getElementById("txtKenar1").value);
	var k2=Number(document.getElementById("txtKenar2").value);

var hipotenus=(k2+k1);
document.getElementById("sonuc").innerHTML="<h2> <font color=red>SONUÇ: "+hipotenus;
}
var hesapBtn=document.getElementById("btn");
hesapBtn.onclick=Hesapla;
/*-------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------*/

function cikart()
{
	var sayi3=Number(document.getElementById("txtKenar12").value);
	var sayi4=Number(document.getElementById("txtKenar32").value);

var sonuc=(sayi3-sayi4);
document.getElementById("sonuc").innerHTML="<h2> <font color=red>SONUÇ: "+sonuc;
}
var hesapBtn=document.getElementById("btn2");
hesapBtn.onclick=cikart;
/*-------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------*/
function bol()
{
	var yenisayi=Number(document.getElementById("bolme").value);
	var yenisayi2=Number(document.getElementById("bolme2").value);

var sonuc=(yenisayi/yenisayi2);
document.getElementById("sonuc").innerHTML="<h2> <font color=red>SONUÇ: "+sonuc;
}
var hesapBtn=document.getElementById("btn3");
hesapBtn.onclick=bol;
/*-------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------*/
</script>
</body>

</html>
Editor is loading...