How To Add A Shining CSS3 Horizontal Menu For Blogger

<div dir="ltr" style="text-align: left;" trbidi="on"><b>How To Add A Shining CSS3 Horizontal Menu For Blogger </b>: Horizontal menu best alternative option for labels or sections.<br />The importance of horizontal menu including: reducing the space occupied by the sections/labels and distort the appearance of blog, coordinate and beautify the style of blog.<br /><br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3VGxiGaGABvO1CXM1_aX_oIhie6_yQCSF7irWS5Ygaci-OHT8x6z6cApIc5c_RC-2qaNlf9zyKHuGStN8i26jd0T-bsw_gdam27QcjAffrCgY-s6o_5o8E0YwaZ-RQaOQbiApX05Jp_g/s1600/How+to+Add+a+Shining+CSS3+Horizontal+Menu+For+Blogger.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3VGxiGaGABvO1CXM1_aX_oIhie6_yQCSF7irWS5Ygaci-OHT8x6z6cApIc5c_RC-2qaNlf9zyKHuGStN8i26jd0T-bsw_gdam27QcjAffrCgY-s6o_5o8E0YwaZ-RQaOQbiApX05Jp_g/s320/How+to+Add+a+Shining+CSS3+Horizontal+Menu+For+Blogger.gif" width="320" /></a></div><br /><br />This widget is designed by CSS3 technology, And you can add this gadget to your blog with very easy way:<br /><br /><b><span style="color: blue;">Adding the widget to Blogger blog:</span></b><br /><br />1. Go to <span style="color: orange;">Blogger Dashboard</span>  →<span style="color: orange;"> Layout</span> → click on <b><span style="color: #6fa8dc;">"Add a gadget"</span></b>.<br />2. Select "<span style="color: #6fa8dc;"><b>html/java script</b></span>" and add the code given below:<br /><br />........................................................................................................................................<br /><span style="background-color: #eeeeee;"><br /></span><span style="background-color: #eeeeee;"><style type="text/css">.menu li{list-style:none;display:inline}.menu li a{-moz-transition:all 270ms ease-in-out 0s;-webkit-transition:all 310ms ease-in-out;-o-transition:all 270ms ease-in-out;background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDR26LJd4uFKqjN7A-kZ0q5Qa4TaUoqm9ILNH971ldAO8dbBediwmagNblb0nxFiZ1lWIPcpqlCSJhU_v1kfrC_nSnwqep7bcDdxvoC_sXdE0eLojEURM7qiTUUE9YUifdwh9SZERM9nY/s1600/noop-menu-blogger.png") repeat scroll 0 0 transparent;border:1px solid #1357AF!important;border-radius:3px 3px 3px 3px;color:#FFFFFF!important;font:14px arial!important;padding:10px 38px!important;text-decoration:none;text-shadow:1px 1px 0 #000;margin-left:-5px}.menu li a:hover{background-position:right center!important}</style></span><br /><span style="background-color: #eeeeee;"><a href="http://asimbaba.blogspot.com" style="position: absolute;z-index:-11;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBkor9-P_IT9ls4zrrwnP1G-rqokxfV6O4Js47I5eX5vRcRDo9Fl362eGX6MmfkLclrY8INaYKqYrtIKvs4ZMQpJub1se-VI8w2EJo7LBdXuUeLcc_j4aWwTlkkKOjAaJnr01LrCjbZj4/s1600/1x1juice.png" /></a></span><br /><span style="background-color: #eeeeee;"><div class="wg-shining-menu"></span><br /><span style="background-color: #eeeeee;">    <ul class="menu"></span><br /><span style="background-color: #eeeeee;">        <li><a href="<span style="color: blue;">http://asimbaba.blogspot.com/</span>"><span style="color: red;">Home</span></a></li></span><br /><span style="background-color: #eeeeee;">        <li><a href="<span style="color: blue;">http://asimbaba.blogspot.com/</span>"><span style="color: red;">Features</span></a></li></span><br /><span style="background-color: #eeeeee;">        <li><a href="<span style="color: blue;">http://asimbaba.blogspot.com/</span>"><span style="color: red;">Products</span></a></li></span><br /><span style="background-color: #eeeeee;">        <li><a href="<span style="color: blue;">http://asimbaba.blogspot.com/</span>"><span style="color: red;">Contact</span></a></li></span><br /><span style="background-color: #eeeeee;">        <li><a href="<span style="color: blue;">http://asimbaba.blogspot.com/</span>"><span style="color: red;">Tips</span></a></li></span><br /><span style="background-color: #eeeeee;">        <li><a href="<span style="color: blue;">http://asimbaba.blogspot.com/</span>"><span style="color: red;">Tricks</span></a></li></span><br /><span style="background-color: #eeeeee;">        <li><a href="<span style="color: blue;">http://asimbaba.blogspot.com/</span>"><span style="color: red;">About</span></a></li></span><br /><span style="background-color: #eeeeee;">    </ul></span><br /><span style="background-color: #eeeeee;"><br /></span><span style="background-color: #eeeeee;"></div></span><br /><span style="background-color: #eeeeee;"><br /></span>..................................................................................................................................................<br /><span style="color: blue; font-weight: bold;">NOTE: </span><br />3. - Replace the URL in <span style="color: blue;"><b>blue</b></span> with your own.<br />    - Replace the tab name in <b><span style="color: red;">red</span></b> with your own.<br />4. Finally click on save.<br />Now you can see the result<br />..................................................................................................................................................</div>

How To Add A Shining CSS3 Horizontal Menu For Blogger

How To Add A Shining CSS3 Horizontal Menu For Blogger : Horizontal menu best alternative option for labels or sections. The importance of ho...

Read more »