Add Pearl White Menu to Blogger

This is a simple Pearl White menu blogger who want to add a classic look type menu to his blogger.this is a Css customize menu which you can easily add it your blogger .

CSS EFFECT..

Now First we will add the CSS Code in Blogger Template so follow my below steps..

• Login to Blogger  >> Click on drop down menu >>then select "Template".
• Now you will see  "EDIT HTML" Button ,Click on it >>  and then click Proceed button .
• Now find this tag ]]></b:skin> by using CTRL + F 
• Paste below code Just Before/above ]]></b:skin> tag  and Save the Template.

body {
font: bold 11px/1.5em Verdana;
}

h1 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
margin:0;
padding:0;
}

hr {
border:none;
border-top:1px solid #CCCCCC;
height:1px;
margin-bottom:25px;
}

#tabs {
float:left;
width:100%;
font-size:93%;
line-height:normal;
border-bottom:1px solid #84776B;
}

#tabs ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}

#tabs li {
display:inline;
margin:0;
padding:0;
}

#tabs a {
float:left;
background:url("https://egytricks.googlecode.com/files/tableft.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}

#tabs a span {
float:left;
display:block;
background:url("https://egytricks.googlecode.com/files/tabright.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#84776B;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs a span {float:none;}

/* End IE5-Mac hack */
#tabs a:hover span {
color:#74675B;
}

#tabs a:hover {
background-position:0% -42px;
}

#tabs a:hover span {
background-position:100% -42px;
}

MENU CODE

Now we can  use below code to add menu any where we want. you can add it as HTML WIDGET in blogger layout,But i will  Recommend You to Replace this menu code in your Blogger Template with already existing one., or add below code before or after already existing one menu code.

• Login to Blogger  >> Click on drop down >> Now select "Layout"
• Now you will see "Add a Gadget" button click any of them
• A new window will open .Scroll some down until you see " HTML/JavaScript" Button.
• Click on " HTML/JavaScript" Button ,leave the Title blank and Put the below code in Content and then after click on save button.

<div id="tabs">
  <ul>
    <li><a href="http://www.egytricks.com/"><span>Link 1</span></a></li>
    <li><a href="http://www.egytricks.com/"><span>Link 2</span></a></li>
    <li><a href="http://www.egytricks.com/"><span>Link 3</span></a></li>
    <li><a href="http://www.egytricks.com/" title="Free CSS Menus"><span>Free CSS Menus</span></a></li>
    <li><a href="http://www.egytricks.com/"><span>Link 5</span></a></li>
    <li><a href="http://www.egytricks.com/"><span>Link 6</span></a></li>
    <li><a rel="nofollow" target="_blank" href="http://egytricks.com/" title="Trikcs World"><span>Trikcs World</span></a></li>
  </ul>
</div>

Now all done if have any question or Problem according to this Pearl White Menu for  Blogger then hesitate to Comment below

Also try Uc Player-Best Free Player for Symbian