SCRIPT

on
LINK MENGGUNAKAN BOTSTRAP

<!DOCTYPE html>
<html lang=”en”>
  <head>
    <meta charset=”utf-8″>
    <meta http-equiv=”X-UA-Compatible” content=”IE=edge”>
    <meta name=”viewport” content=”width=device-width, initial-scale=1″>
    <title>Link dengan tampilan button</title> <link href=”css/bootstrap.min.css” rel=”stylesheet”></head><body> <div class=”container”> <br/><a href=”#” class=”btn btn-default”>Klik default</a> <br/><br/><a href=”#” class=”btn btn-primary  btn-xs”>Klik primary – extra small</a> <br/><br/>

        <a href=”#” class=”btn btn-success btn-sm”>Klik success – small</a> <br/><br/>
        <a href=”#” class=”btn btn-info btn-lg”>Klik info – large</a> <br/><br/>
        <a href=”#” class=”btn btn-warning”>Klik warning</a> <br/><br/>
        <a href=”#” class=”btn btn-danger”>Klik danger</a> <br/><br/>
    </div> <!– /container –><script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js”></script><script src=”js/bootstrap.min.js”></script></body></html>





BUTTON LINK WARNA


<button onclick="window.location=
'https://BUTTON KINK WARNA.com' "style="background-color: #7ae6c9; color: white; height: 35px; width: 150px;">
<b>
Button Link Berwarna</b>
</button>

TAMPILAN :


TAG LINK

3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<!DOCTYPE html>
<html>
<head>
<title>Contoh Button Link</title>
<style>
.link-button{
text-decoration: none;
background-color: #eeeeee;
color: black;
padding: 2px 6px 2px 6px;
border: 1px solid #c2c2c2;
border-radius:2px;
}
</style>
</head>
<body>
<!-- Contoh 1 -->
<a href="komentar.html" class="link-button">Link 1</a>
<br><br>
<!-- Contoh 2 -->
<a href="https://carakode.com" class="link-button">Link 2</a>
</body>
</html>

MEMBERI WARNA PADA TOMBOL


<!DOCTYPE html><html><head><style>.button { background-color: #4CAF50; /* Hijau */border: none; color: white;padding: 15px 32px; text-align: center;text-decoration: none;  display: inline-block;font-size: 16px;margin: 4px 2px; cursor: pointer;}.button2 {background-color: #008CBA;} /* Biru */.button3 {background-color: #f44336;} /* Merah */ .button4 {background-color: #e7e7e7; color: black;} /* Abu-abu */ .button5 {background-color: #555555;} /* Hitam */</style></head><body><h2>Warna-warna Tombol</h2><p>Mengubah warna background tombol menggunakan background-color property:</p><button class="button">Hijau</button><button class="button button2">Biru</button><button class="button button3">Merah</button><button class="button button4">Abu-abu</button><button class="button button5">Hitam</button></body></html>

TAMPILAN : 


Warna-warna Tombol

Mengubah warna background tombol menggunakan background-color property:


TOMBOL

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<!DOCTYPE html>
<html>
<head>
<title>Membuat Tag Anchor Menjadi Tombol Berwarna</title>
<style>
.btn_a_style{
text-decoration: none;
font-family: sans-serif;
font-size: 13px;
border: 1px solid #cecece;
border-radius:3px;
padding: 3px 10px;
box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);
color: white;
}
.btn_red{
background-color: red;
}
.btn_cyan{
background-color: #00ffff;
}
.btn_orange{
background-color: #ffa500;
}
.btn_tomato{
background-color: #ff6347;
}
.btn_a_style:hover{
border: 1px solid #b1b1b1;
box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
}
</style>
</head>
<body>
<a href="#" class="btn_a_style btn_red">Tombol</a>
<a href="#" class="btn_a_style btn_cyan">Tombol</a>
<a href="#" class="btn_a_style btn_orange">Tombol</a>
<a href="#" class="btn_a_style btn_tomato">Tombol</a>
</body>
</html>

TAMPILAN :
TAG ANCOR MENJADI TOMBOL BERWARNA
Membuat Tag Anchor Menjadi Tombol Berwarna Tombol Tombol Tombol Tombol

<html>
<head>
<title>Membuat Tag Anchor Menjadi Tombol Berwarna</title>
<style>
.btn_a_style{
text-decoration: none;
font-family: sans-serif;
font-size: 13px;
border: 1px solid #cecece;
border-radius:3px;
padding: 3px 10px;
box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);
color: white;
background-color: red;
}
.btn_a_style:hover{
border: 1px solid #b1b1b1;
box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
}
</style>
</head>
<body>
<a href="#" class="btn_a_style">Tombol</a>
</body>
</html>

Membuat Tag Anchor Menjadi Tombol Berwarna Tombol


TOMBOL 

<html>
<head>
    <title>Membuat Button Berwarna Di HTML</title>
<style>
.btn_style{
border: 1px solid #cecece;
border-radius: 3px;
padding: 3px 10px;
box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);
color: white;
}
.btn_red{
background-color: red;
}
.btn_green{
background-color: green;
}
.btn_brown{
background-color: #a52a2a;
}
.btn_maroon{
background-color: #b03060;
}
.btn_orange{
background-color: #ffa500;
}
.btn_pale{
background-color: #db7093;
}
.btn_style:hover{
border: 1px solid #b1b1b1;
box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
}
</style>
</head>
<body>
<button class="btn_style btn_red">Tombol</button>
<button class="btn_style btn_green">Tombol</button>
<button class="btn_style btn_brown">Tombol</button>
<button class="btn_style btn_orange">Tombol</button>
<button class="btn_style btn_pale">Tombol</button>
</body>
</html>

Membuat Button Berwarna Di HTML


SCRIPT CSS

<img src="alamat gbr" height="300px" width="500px;">


COUNTER LINK DOWNLOAD


<a href="http://dstats.net/download/Paste-File-Link-Disini"><img src="Image URL-Gambar-Tombol-Download  border="0"/></a>
<p>Downloads:<a href='http://dstats.net/download/Paste-File-Link-Disini'></a>
<script type='text/javascript' src='http://dstats.net/dstatsjs.php?file=Paste-File-Link-Disini'></script>
<script type='text/javascript'>document.write(dsCounter);</script></p>


SCRIPT DOWNLOAD COUNTER DSTATS

<script type='text/javascript' src='http://dstats.net/js/dstracker.js'></script><a href='FILE ANDA' onclick='return dstatstracker(this);'>DOWNLOAD</a><script type='text/javascript' src='http://dstats.net/dstatsjs.php?file=FILE ANDA'></script><script type='text/javascript'>document.write(dsdlcounter(dsCounter));</script>


SCRIPT FRAME EMBED GOOGLE DRIVE

<a href="https://drive.google.com/uc?export=download&amp;id=1v7bWXpi-zsOS2OlUhuymHaS6idinIIuk"><img alt="DESKRIPSI GAMBAR" border="none" height="61" src="http://drive.google.com/uc?export=view&amp;id=1o53wB-zcZTA-pw8zBVdkWyoGYM-1sL7Z" title="DOWNLOAD ARTIKEL" width="213" /></a>


SCRIPT COUNT DOWN

<html>
   <head>
   <title>Count Down Download dengan JavaScript</title>
   <script type="text/javascript"> 
    var counter = 10;
    function countDown(){      
        if(counter>=0){
            document.getElementById("timer").innerHTML = counter;
        }
        else{
            download();
            return;
        }
        counter -= 1;
        var counter2 = setTimeout("countDown()",1000);
        return;
    }
     
    function download(){
        document.getElementById("link").innerHTML =
"<a href='http://namasitus/filedownload'>Download</a>";
    }
   </script>
   </head>
   <body>
        <h1>File Download</h1>
 
        <h3>Link download akan muncul dalam <span id="timer"></span> detik.</h3>
        <p><span id="link"></span></p>
   </body>
   </html>


SCRIPT FRAME

 <div style="background-color: #ace5f4; border: 3px #0180cf double; padding: 10px; text-align: left;">
MASUKKAN KODE HTML DISINI </div>

Comments

Post a Comment