Cara Pasang KBD Mark up Di Blogger Dengan CSS

Hai kali ini saya mau kasih tau cara pasang buat mark up Keyboard kemputer di blogger agar terlihat cantik 😍
mau tau gimana cara nya . yuk kita simak tutorial nya 😂


Yang Pertama kita harus tambahkan kode ini di ]]> </ b: skin>

.post-body kbd{-moz-border-radius:3px;-moz-box-shadow:0 1px 0 rgba(0,0,0,0.2),0 0 0 2px #fff inset;-webkit-border-radius:3px;-webkit-box-shadow:0 1px 0 rgba(0,0,0,0.2),0 0 0 2px #737373 inset;background-color:rgba(0, 186, 255, 0.93);border:1px solid #11beff;border-radius:3px;box-shadow:0 1px 0 rgba(0,0,0,0.2),0 0 0 2px #11beff inset;color:#fff;display:inline-block;font-family:'roboto';font-size:17px;line-height:1.4;margin:0 .1em;padding:.1em .6em;text-shadow:0 1px 0 #fff}
.post-body kbd{max-width: 624px;overflow: auto;}
.post-body kbd:before{position:absolute;content:'Double click to select';display:table;background:#f20000;color:#fff;padding:4px;border-radius:2px;font-size:75%;opacity:0;visibility:hidden;transform:scale(0.8);z-index:2;transition:all .3s;margin:-23px;font-family:'Roboto'}
.post-body kbd:hover:before{transform:scale(1.0);opacity:1;visibility:visible;transition:all .3s}

Simpan Templates.

Result :

`1234567890-=Bkspc

Tabqwertyuiop[]\

Capsasdfghjkl;'Enter

Shiftzxcvbnm,./Shift

Oke selesai :)

Semoga Bermanfaat