Membuat Aplikasi Kalkulator dengan PHP

Script PHP Kalkulator - Pada kesempatan yang sangat baik ini saya akan berbagi mengenai Cara Membuat Aplikasi Kalkulator dengan PHP. Mungkin dari anda ada yang sedang mencari Script PHP kalkulator untuk tugas sekolah atau tugas kuliah.

Pada pembuatan Aplikasi Kalkulator dengan PHP ini hanya menggunakan 2 page saja yaitu page index.php dan style.css untuk mempercantik tampilan Aplikasi Kalkulator.

Baca juga: Aplikasi Panti Asuhan Berbasis Web

Silahkan buat folder nya terlebih dahulu di htdocs, di sini saya membuat folder dengan nama "kalkulator". Folder ini yang nantinya akan kita gunakan untuk menyimpan file index dan style.

Berikut adalah Script PHP Kalkulatornya:

index.php

Silahkan simpan script php kalkulator ini dengan nama index.php

<!DOCTYPE html>

<html>

<head>

<title>Kalkulator Sederhana Dengan PHP | www.jasaaplikasidanweb.web.id</title>

</head>

<body>

<?php

if(isset($_POST['hitung'])){

$bil1 = $_POST['bil1'];

$bil2 = $_POST['bil2'];

$operasi = $_POST['operasi'];

switch ($operasi) {

case 'tambah':

$hasil = $bil1+$bil2;

break;

case 'kurang':

$hasil = $bil1-$bil2;

break;

case 'kali':

$hasil = $bil1*$bil2;

break;

case 'bagi':

$hasil = $bil1/$bil2;

break;

}

<h2 class="judul">KALKULATOR</h2>

<a class="brand" href="http://www.jasaaplikasidanweb.web.id">www.jasaaplikasidanweb.web.id</a>

</select>

</form>

<?php if(isset($_POST['hitung'])){ ?>

<input type="text" value="<?php echo $hasil; ?>" class="bil">

<?php }else{ ?>

<?php } ?>

</div>

</body>

</html>

style.css

Untuk mempercantik tampilan aplikasi kalkulator silahkan anda simpan script di bawah ini dengan nama style.css

body{
background: #F2F2F2;
font-family: sans-serif;
}

.kalkulator{
width: 335px;
background: #2F495A;
margin: 100px auto;
padding: 10px 20px 50px 20px;
border-radius: 5px;
box-shadow: 0px 10px 20px 0px #D1D1D1;
}

.bil{
width: 300px;
margin: 5px;
border: none;
font-size: 16pt;
border-radius: 5px;
padding: 10px;
}

.opt{
font-size: 16pt;
border: none;
width: 215px;
margin: 5px;
border-radius: 5px;
padding: 10px;
}

.tombol{
background: #EC5159;
border-top: none;
border-right: none;
border-left: none;
border-radius: 5px;
padding: 10px 20px;
color: #eee;
font-size: 15pt;
border-bottom:4px solid #BF3D3D;
}

.brand{
color: #eee;
font-size: 11pt;
float: right;
text-decoration: none;
margin: 12px;
}

.judul{
text-align: center;
color: #eee;
font-weight: normal;
}

Jika sudah, sperti biasa silahkan anda akses di browser dengan localhost/kalkulator, jika berhasil tampilan akan seperti di bawah ini