Cara menggunakan membuat button link html
Pada artikel ini akan menjelaskan bagaimana cara membuat button link di html yang keren pada blogger, misalnya tombol download, demo, lihat harga dan sebagainya. Beberapa manfaat button link diantaranya blog kita akan terlihat lebih professional juga memiliki tampilan yang rapi. Saya membuat button diatas menggunakan CSS3. Dimana CSS3 ini tidak akan membebani pemuatan atau loading blog temen-temen. Jadi sangat aman untuk digunakan. Ada 2 cara memasang kode CSS3 untuk button link seperti diatas, yaitu dengan memasang pada Desiner Tema di Tata Letak dan dengan memasukan kode CSS3 ini ke dalam tema melalui Tema Edit HTML. Untuk melihat live demonya, silahkan lihat postingan saya yang berjudul Aplikasi Penambah Kontak WA. Ok langsung saja kita praktekan kedua cara tersebut. Cara Membuat Button Link di html Melalui Desiner TemaIkuti langkah-langkah berikut ini:
.btn{list-style:none;text-align:center;margin:10px!important;padding:10px!important;font-size:14px;clear:both;display:inline-block;text-decoration:none!important;color:#FFF!important} .btn ul {margin:0;padding:0} .btn li{display:inline;margin:5px;padding:0;list-style:none;} .demo,.download{padding:12px 15px!important;color:#fff!important;font-weight:700;font-size:14px;font-family:Open Sans,sans-serif;text-align:center;text-transform:uppercase;border-radius:3px;opacity:.95;border:0;letter-spacing:2px;transition:all .2s ease-out} .demo {background-color:#0288d1;} .download {background-color:#ff5000;} .demo:hover {background-color:#60B8F4;color:#fff;border-bottom:2px solid #3498DB; opacity:1;} .download:hover {background-color:#49DDAA;color:#fff;border-bottom:2px solid #1ABC84;opacity:1;} .demo:before {content:'\f135';display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;} .download:before {content:'\f019';display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;}
Cara Membuat Button Link di html Melalui Tema Edit HTMLIkuti langkah-langkah berikut ini:
.btn{list-style:none;text-align:center;margin:10px!important;padding:10px!important;font-size:14px;clear:both;display:inline-block;text-decoration:none!important;color:#FFF!important} .btn ul {margin:0;padding:0} .btn li{display:inline;margin:5px;padding:0;list-style:none;} .demo,.download{padding:12px 15px!important;color:#fff!important;font-weight:700;font-size:14px;font-family:Open Sans,sans-serif;text-align:center;text-transform:uppercase;border-radius:3px;opacity:.95;border:0;letter-spacing:2px;transition:all .2s ease-out} .demo {background-color:#0288d1;} .download {background-color:#ff5000;} .demo:hover {background-color:#60B8F4;color:#fff;border-bottom:2px solid #3498DB; opacity:1;} .download:hover {background-color:#49DDAA;color:#fff;border-bottom:2px solid #1ABC84;opacity:1;} .demo:before {content:'\f135';display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;} .download:before {content:'\f019';display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;}
Itulah Cara Membuat Button Link di html yang Keren pada blogger. semoga bermanfaat. Bagaimana Membuat tag link di HTML?Cara Membuat Link di HTML
Link pada HTML dapa dibuat dengan tag , kemudian tag ini harus memiliki atribut href untuk menentukan alamat URL tujuan dari link. Link akan ditampilkan dengan warna biru dan garis bawah. Ini adalah style standar dari setiap browser.
Bagaimana cara menulis link?Link ditulis dengan yang merupakan singkatan cari anchor (jangkar). Setiap tag setidaknya memiliki sebuah atribut href. Dimana href berisi alamat yang dituju (href adalah singkatan dari hypertext reference).
Apa itu Button di website?Tombol (button) merupakan hal yang lazim digunakan saat mengirimkan formulir untuk dikirimkan menuju server. Pemberian tombol submit pada halaman HTML akan memudahkan pengguna saat proses pengiriman data menuju server. Penggunaan tombol submit sebenarnya tidak mutlak diberikan.
Apa itu link pada HTML?Hyperlink adalah suatu fungsi yang ada di dalam halaman HTML yang mampu membantu para pembaca menuju informasi lainnya secara singkat. Umumnya, teks yang disisipkan dengan hyperlink bisa dilihat secara mudah perbedaannya dalam suatu slide presentasi ataupun website.
|