Skip to main content

Posts

Showing posts with the label CSS Menu

How to Add Beautiful CSS Buttons for Your Blogger Blog

By
How to add this buttons to your blog
These buttons are very easy to use. Now I would like to divide the instalation of this widgets into two parts, that's CSS part as well as HTML part. At first we can add the CSS code. Please follow the below steps.


Go to Blogger Dashboard > TemplateBackup your Template before making any changes to your blogClick on Edit HTMLTick Expand Widget TemplatesPress Ctrl + F and search the code shown below ▼

? 1 ]]></b:skin>
Now add the below ▼ code just Above/Before ]]></b:skin> (use Ctrl+F to find the code)
.button { -moz-border-radius:5px5px5px5px; -webkit-border-radius:5px5px5px5px; border-radius:5px5px5px5px; -moz-box-shadow:01px3pxrgba(0, 0, 0, 0.25); -webkit-box-shadow:01px3pxrgba(0, 0, 0, 0.25); box-shadow:01px3pxrgba(0, 0, 0, 0.25); background:scroll00#222222; border-bottom:1pxsolidrgba(0, 0, 0, 0.25); color:#FFFFFF!important; cursor:pointer; font-weight:bold; line-height:1; overflow:visible; font-size:17px; padding:8px19px9px; position:relative…
Read more

Submenu or Dropdown Menu in horizontal Main Menu

By
Submenu/Dropdown Menu in horizontal Main Menu: This section will explain the drop down menu or submenu in horizontal Menu. In modern interactive web designing, drop down menus appear very frequently.
Script to Sub Menu/Dropdown Menu


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML

1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-

transitional.dtd"> <html

xmlns="http://www.w3.org/1999/xhtml"> <head>

<title>Example of HTML Menu</title> <style

type="text/css" media="screen"> #nicefooter ul {

padding:1; margin:1; list-style:none; } #nicefooter li {

float:left; position:relative; padding: 3px 0px 3px 10px;

display:block; border: 0px solid #CC55FF; background:

#c0c0c0; } #nicefooter li a {color:#000; text-

decoration:none;display:block; border-right:1px solid

#CC55FF;padding-right:10px;} #nicefooter li a:hover

{color:#fff; text-decoration:none;} #nicefooter li ul li a

{color:blue; text…
Read more