Add Keyboard Keys With Your Text In Blogger
Hi friends, do you know, you can use keyboard key like text in your blogger posts. Here is an example : ctrl. It can be done using a very simple CSS Code. So, let's start with the code:
> Login to your blogger account.
> Now go to template > Edit HTML.
> Now search for ]]></b:skin> in the code.
> Now, copy and paste this code just above ]]></b:skin>.
> Now save your template and you are done.
> Now, while posting any blog post, just add your text within <kbk>YOUR TEXT HERE</kbk> in html editing mode to make it appear as a keyboard key.
> Enjoy.
> Login to your blogger account.
> Now go to template > Edit HTML.
> Now search for ]]></b:skin> in the code.
> Now, copy and paste this code just above ]]></b:skin>.
kbk{-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;border:1px solid gray;padding:1px 5px;margin:0 5px;font-family:courier new;font-size:1.2em;-webkit-box-shadow:1px 0 1px 0 #fff, 0 2px 0 2px lightGray, 0 2px 0 3px #333;-moz-box-shadow:1px 0 1px 0 #fff, 0 2px 0 2px lightGray, 0 2px 0 3px #333;box-shadow:1px 0 1px 0 #fff, 0 2px 0 2px lightGray, 0 2px 0 3px #333;background:-moz-linear-gradient(left, #fff 0%, #e2e2e2 25%);background:-webkit-gradient(linear, left top, right top, color-stop(0%, #ffffff), color-stop(25%, #e2e2e2));background:-webkit-linear-gradient(left, #fff 0%, #e2e2e2 25%);background:-o-linear-gradient(left, #fff 0%, #e2e2e2 25%);background:-ms-linear-gradient(left, #fff 0%, #e2e2e2 25%);background:linear-gradient(left, #fff 0%, #e2e2e2 25%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e2e2e2', GradientType=1 )}kbk.space{padding:0 90px}kbk:hover{cursor:default}
> Now save your template and you are done.
> Now, while posting any blog post, just add your text within <kbk>YOUR TEXT HERE</kbk> in html editing mode to make it appear as a keyboard key.
> Enjoy.