Membuat Efek Tombol Keyboard dengan CSS di Blog

Membuat Efek Tombol Keyboard dengan CSS - Hello sobat apa kabar? pastinya baik semua donk Membahas soal keyboard, kali ini saya bukan membahas soal keyboard sungguhan melainkan membahas Cara Membuat Keyboard Dengan CSS, jadi bukan buat ngetik ya sob. Intinya agar lebih indah dilihat gak berantakkan, css ini sangat penting bagi sobat yang suka hmm... berbagi ilmu yang kebanyakan menggunakan tombol keyboard. Langsung saja yuk cekidotttt

Demo

Membuat Efek Tombol Keyboard Dengan CSS

www. g-bloog .com

Q W E R T Y U I O P

Intinya hanya terletak pada CSS doank tanpa menggunakan gambar.

Penerapan

• Masuk Blogger
• Masuk ke Dashboard
• Kemudian pilih menu Template dan menuju Edit HTML
• Langsung saja sobat masukkan kode dibawah ini tepat diatas ]]></b:skin>

/* Efek Tombol Keyboard www.g-bloog.com
-------------------------------------------------------------------- */
key{
background:#fff;
border:1px solid gray;
font-size:1.2em;
color:#000;
box-shadow:1px 0 1px 0 #eee, 0 2px 0 2px #ccc, 0 2px 0 3px #444;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
margin:2px 3px;
padding:1px 5px;
}

Source CSS

 Nah selanjutnya tinggal sobat melakukan penulisan dengan diawali tag <key> dan penutup dengan Tag </key> di artikel maupun dimanapun sobat ingin asalkan tetap berada di kawasan dimana blog yang sobat pasang CSSnya, jika sobat belum mengerti, berikut penjelasan penulisan singkat.

• Sekarang sobat masukkan HTMLnya, jika ingin memunculkan di Postingan blog sobat sobat cukup masuk ke Entri baru kemudian klik Html (ingat bukan Compose)

<key>Silahkan sobat masukkan kata- kata atau huruf yang sobat inginkan</key>

 Selesai sekarang Efek tombol Keyboard dengan CSS berhasil diterapkan. Nah sekarang sobat coba sendiri ya.. Jika ada hal yang kurang jelas/ kurang dimengerti sobat bisa bertanya melalui kotak komentar yang tersedia di bawah artikel blog ini.

 Demikian artikel yang saya buat, semoga bermanfaat bagi kita dan menambah wawasan bagi sobat tentang kode- kode blogger. Wassalamualaikum wr. wb