• RexDev Learn Web Design

  • Sinau WEb Design Bebarengan

  • #WEB_DESIGN

Wednesday, 30 August 2017

Hasil gambar untuk stikom banyuwangi

Ini adalah Contoh Script untuk plajaran Alpro Membuat Penjumlahan 2 Bilangan
menggunakan html dan javascript



<!DOCTYPE html>
<html>
    <head>
        <title>Penjumlahan 2 Variabel</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <style>  
                .box {
                    width: 40%;
                    border-radius: 5px;
                    border: 1px solid #9b9b9b;
                    padding: 20px 0px 20px 0px;
                    margin-left: 30%;
                }
                .h2{
                    font-family: calibri;
                    font-weight: lighter;
                    letter-spacing: 3px;
                }
                #bil1{
                    padding: 5px;
                }
             
                #bil2{
                    padding: 5px;
                }
                #hasil{
                    color: #ff0b0b;
                }
            </style>
    </head>
    <body>
        <div class="box">
            <center>
                <h2 class="h2">Aplikasi Penjumlahan 2 bilangan</h2>
        <div class="box1">
            <label>Bil 1</label>
            <input type="text" id="bil1" placeholder="Masukan bilangan 1">
        </div>
                <br>
        <div class="box2">
            <label>Bil 2</label>
            <input type="text" id="bil2" placeholder="Masukan bilangan 2">
        </div>
        <div class="box3">
            <label>Hasil</label>
            <label id="hasil"></label>
         
        </div>
<br>
<input type="button" id="btn" value="Jumlah" class="btn" onClick="jumlah()">
            </center>
        </div>
<script>
function jumlah(){

var a = document.getElementById("bil1").value;
var b = document.getElementById("bil2").value;
             
            document.getElementById("hasil").innerHTML = parseFloat(a) + parseFloat(b);

}
</script>
    </body>
</html>



Lihat Projek Di Code Pen    Ini Linknya    Projek

buat text editor nih saya kasih beberapa referensi buat text editornya:

    a. Brackets                                   nih link downloadnya        Download Brackets
    b. Notepad++                               nih link downloadnya        Download Notepad++
    b. Adobe Dreamweaver CS6       nih link downloadnya        Download Adobe 


Dreamweaver CS6


14 comments: