Jumat, 01 Juli 2022

CARA MEMBUAT KALKULATOR SEDERHANA

Disini saya akan membahas cara membuat aplikasi kalkulator sederhana menggunakan php, untuk coding yang akan kita gunakan adalah sebagai berikut beserta penjelasannya:



<html>

<head>

<!--Fungsinya adalah tag yang digunakan untuk mendefinisikan judul atau nama dari dokumen HTML-->


<title>Membuat Kalkulator Sederhana Dengan HTML, PHP, dan CSS3</title>

<!--Digunakan untuk menampilkan judul di web-->


<link rel="stylesheet" type="text/css" href="kalkulator-style.css">

<!--Script di bawah merupakan cara pembuatan untuk menampilkan hasilnya cukup untuk memanggil variabel $hasil-->


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;

<!--Fungsinya adalah digunakan untuk membuat heading atau judul-->


<div class="kalkulator">

<h2 class="judul">kalkulator sederhana</h2>

<!--Fungsinya untuk membuat sebuah from html input pengguna-->


<form method="post" action="kalkulator.php">

<!--Membuat program inputan angka dengan php lihat kode text field untuk menampilkan angka 1 dan 2 dan hasil-->


<input type="text" name="bil1" class="bil" autocomplete="off" placeholder="Bilangan Pertama">

<input type="text" name="bil2" class="bil" autocomplete="off" placeholder="Bilangan Kedua">

<select class="opt" name="operasi">

<option value="tambah">+</option>

<option value="kurang">-</option>

<option value="kali">x</option>

<option value="bagi">/</option>

</select>

<!--Untuk mengetahu hasil pertambahan, perkalian, pengurangan, dan pembagian-->

<input type="submit" name="hitung" value="Hitung" class="tombol">

</form>

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

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

<?php }else{ ?>

<input type="text" value="0" class="bil">

 <?php } ?>

<!--Fungsinya untuk menutup dan mengakhiri perintah-->


</tr>

</td>

</from>

</table>

</div>

</body>

</html>


Untuk hasil akhir seperti ini

Sekian dari saya. Terimakasih


di Tidak ada komentar:

Jumat, 20 Mei 2022

Cara Membuat Web Penjualan Mobil

Baiklah teman-teman di sini saya ingin membuat tutorial cara membuat halaman web dengan menjual mobil dengan menggunakan bahasa pemograman HTML banyak di antara kita menggunakan online shop untuk membeli beberapa mobil jadi saya berinisiatif membuat halaman web untuk mempermudah teman-teman ketika ingin membeli mobil dan membuat halaman web untuk penjualan mobil mobil.

Di sini saya menggunakan bahsa pemograman yang mudah di pahami oleh teman-teman agar bisa di gunakan apabila teman-teman berniat membuat halaman web online shop.

<!DOCTYPE html>

<html>

<head>

<title></title>

<style> 

body

background-image: url('fitri.jpg');

 background-repeat: no-repeat;

background-attachment: fixed;

background-size: 100% 100%;

}
</style>

</head>

<body>

<style type="text/css">
 a{text-decoration: none; font-size: 20px;font-family: sans-serif;padding: 14px 10px} ul{padding: 14px}
li{list-style: none; display: inline;}

li a{background: #222; color:#FFEBCD;}

   
 
li a:hover{background: #4da4ff; color:#fff;}


    
.navi{background: #222; height: 50px}



</style>


 <nav class="navi">

 
  
 <ul>

       
<li><a href="#">Home</a></li>

  
 <li><a href="#">Rekomendasi</a></li>

 
<li><a href="#">Koleksi Digital</a></li>

  <li><a href="#">Layanan</a></li>

  
    <li><a href="#">Profil</a></li>


 <h1 align="center"style="background-color:#FFEBCD">SELAMAT DATANG DI WEBSITE RESMI PENJUALAN MOBIL DENGAN HARGA TERJANGKAU 

</h1>

<table style=''width:100%> 

<tr>

<h1 align="center" style="color:Orange;">1.MOBIL HONDA </h1>
 
   <p<th>
<h1 align="center"><img src="MOBIL 1.JPG" style="width:500px;height:620px;"> 
</th>
</p>

<br>
<button class="button2 center"><a href="file:///D:/mayo/jenis.html"><span>Lihat!</span></button></a><br><br>

<h1 align="center" style="color:DodgerBlue;">2.MOBIL SUZUKI </h1>
   
 <p<th>
<h1 align="center"><img src="MOBIL 3.JPG" style="width:500px;height:620px;"></th></p>
  
<br>
<button class="button2 center"><a href="file:///D:/mayo/jenis.HTML"><span>Lihat!</span></button></a><br><br>
 
<h1 align="center" style="color:Orange;">3.MOBIL JEEP </h1>
 
<p<th>
<h1 align="center"><img src="MOBIL 4.JPG" style="width:500px;height:620px;">
</th>
</p>

<br>
<button class="button2 center"><a href="file:///C:/Users/ASUS/Desktop/Y.%20KONSENTRASI/mobilhonda.html"><span>Lihat!</span></button></a><br><br>

<h1 align="center" style="color:DodgerBlue;">4.MOBIL MITSUBISHI </h1>
   
<p<th>
<h1 align="center"><img src="MOBIL 6.JPG" style="width:500px;height:620px;"></th></p>
  
<br>
<button class="button2 center"><a href="file:///C:/Users/ASUS/Desktop/Y.%20KONSENTRASI/mobilsuzuki.HTML"><span>Lihat!</span></button></a><br><br>
 
     
<h1 align="center" style="color:Orange;">5.MOBIL TESLA </h1>
 
   
<p<th>
<h1 align="center"><img src="MOBIL 5.JPG" style="width:500px;height:720px;">
</th>
</p>

<br>
<button class="button2 center"><a href="file:///C:/Users/ASUS/Desktop/Y.%20KONSENTRASI/mobildaihatsu.html"><span>lihat!</span></button></a><br><br>

</tr>

</body>
</html>
Kemudian hasilnya akan jadi seperti ini:


Kita sudah masuk kedalam bagian merk mobil, klik salah satu merek untuk melihat bagian dalamnya. Selanjutnya kita akan membuat web baru untuk membuat notepad baru untuk membuat web agar dapat memilih mobil yang akan dibeli.
<html> <head> <tittle> MOBIL HONDA </title> <head> <body> <h1 align="center" style="color:Orange;">1.MOBIL NEW HONDA CR-V </h1> <h3 align="center" style="color:Tomato;">Harga: Mulai Rp 515,9 juta</h3> <h1 align="center"><img src="MOBIL 2.JPG" style="width:500px;height:620px;"> <h3 style="color:Tomato;">MOBIL NEW SIENTA</h3> <h3 style="color:Tomato;">Harga:Rp.500.000.000</h3> <p<th><img src="MOBIL2.JPG" style="width:300px;height:420px;"></th> </p> <h3 style="color:Tomato;">MOBIL NEW VELLFIRE</h3> <h3 style="color:Tomato;">Harga:Rp.400.000.000</h3> <p<th><img src="MOBIL3.PNG" style="width:300px;height:420px;"></th> </p> <h3 style="color:Tomato;">MOBIL KIJANG INNOVA</h3> <h3 style="color:Tomato;">Harga:Rp.100.000.000</h3> <p<th><img src="MOBIL4.PNG" style="width:300px;height:420px;"></th> </p> <h3 style="color:Tomato;">MOBIL ALL NEW VOXY</h3> <h3 style="color:Tomato;">Harga:Rp.700.000.000</h3> <p<th><img src="MOBIL5.JPG" style="width:300px;height:420px;"></th> </p> <br> <button class="button2 center"><a href="file:///C:/Users/ASUS/Desktop/Y.%20KONSENTRASI/JUALMOBIL.HTML"><span>kembali!</span></button></a><br><br>

INI ADALAH HASIL DARI HTML DI ATAS


Sekian dari saya terimakasih.
di Tidak ada komentar:

Kamis, 28 April 2022

PERPUSTAKAAN STIM SUKMA

NAMA    : RIO DANIEL PANDIANGAN

NIM        : 21140037

KELAS    : OTAK KANAN B



<!DOCTYPE html>

<html>

<head>

<title>Sistem Informasi Perpustakaan Stim Sukma Medan</title>

</head>

<body>

<h1 align="center">Selamat Datang Di Sistem Informatika Perpustakaan</h1>


<p align="center"><img src="LOGGO.jpg" width="250" height="250" >






<h1 align="center">Beberapa Contoh Buku yang Ada Di Perpustakaan<h1>

<table style="widht:100%">


<img src="FOTO1.jpg" style="widht:500px;height:520px;">

<img src="FOTO 2.jpg" style="widht:500px;height:520px;">

<img src="FOTO 3.jpg" style="widht:500px;height:520px;">


<h1 align="center">Beberapa Contoh Fasilitas yang Ada Di Perpustakaan<h1>

<table style="widht:100%">


<img src="FOTO 4.jpg" style="widht:400px;height:500px;">

<img src="FOTO 5.jpg" style="widht:400px;height:500px;">



 </tr>

</table>

</body>

<html>






di Tidak ada komentar:
Langganan: Postingan (Atom)

Contact Us

  Hubungi Kami Kami selalu siap membantu dan menjawab pertanyaan Anda. Silakan gunakan salah satu metode kontak di bawah ini untuk menghubun...

  • PROMO
      Nikmati Beragam Promo Menarik TRACtoGo Year End Fest 2024: Promo Pesta Akhir Tahun dari TRAC Libur akhir tahun udah dekat, MAYO punya pena...
  • Belajar Aritmatika di PHP
        Operator Aritmatika adalah beberapa operator yang digunakan untuk melakukan perhitungan Matematika. Beberapa operator tersebut diantaran...
  • Privacy Policy
    **Kebijakan Privasi** Terakhir diperbarui: 26 Oktober 2024 Kami di MayoCarS sangat menghargai privasi Anda. Kebijakan Privasi ini menjelaska...