Css3 Dark Blue Navigation Bar For Blogger

Sedikit Info Seputar Css3 Dark Blue Navigation Bar For Blogger Terbaru 2017 - Hay gaes kali ini team Android Apps For Free, kali ini akan membahas artikel dengan judul Css3 Dark Blue Navigation Bar For Blogger , kami selaku Team Android Apps For Free telah mempersiapkan artikel ini untuk sobat sobat yang menyukai Android Apps For Free. semoga isi postingan tentang Artikel menu, yang saya posting kali ini dapat dipahami dengan mudah serta memberi manfa'at bagi kalian semua, walaupun tidak sempurna setidaknya artikel kami memberi sedikit informasi kepada kalian semua. ok langsung simak aja sob
Judul: Berbagi Info Seputar Css3 Dark Blue Navigation Bar For Blogger Terbaru
link: Css3 Dark Blue Navigation Bar For Blogger

Berbagi Css3 Dark Blue Navigation Bar For Blogger Terbaru dan Terlengkap 2017

Navigation bar is very important in websites. It helps to navigate important page easily.So, your audience can find important pages.Other things is, Everyone can add navigation bar for their blogs.
But you have to add attractive menu for your blogs.It will give nice looks to your blogs and helps to attractive your audience too.In this tutorial im gonna explain how to add Css3 dark blue navigation bar for your blog.Every steps explained well to understand newbies.Just give a try to add Css3 Dark color navigation bar.

How to add Css3 Dark Blue Navigation Bar

1. Log in to blogger account and Click drop down.

2. Now select "Template" Like Below.

3. Now you can see Live on blog, Click EDIT HTML Button"

4. Find this tag by using Ctrl+F    ]]></b:skin>

5. Paste below code Before ]]></b:skin> tag

/* The CSS Code for the menu starts here bloggertrix.com */

#navigation1 { width:900px;height: 45px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrMpGnA9S9-hzLlInjjIcVyvL5duy_iP_E8bMbUChM4ix3gEQQng1jjHDB7GlsimXnUl0IsoLkFxdsMyBPM7XfRgNjijoZzaULeY6W3vWeEalrziTad8qXjRUhonG0gdDSsfywNebyiFU/s1600/nav-bg.gif) repeat-x 0 0;
border:inherit 2px #000000;
-moz-border-radius-topleft: 10px;-moz-border-radius-topright:10px;-moz-border-radius-bottomleft:10px;-moz-border-radius-bottomright:10px;-webkit-border-top-left-radius:10px;-webkit-border-top-right-radius:10px;-webkit-border-bottom-left-radius:10px;-webkit-border-bottom-right-radius:10px;
border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-left-radius:10px;border-bottom-right-radius:10px; }
#navigation1 ul { list-style: none outside; padding: 8px 0 0 8px; }
#navigation1 li { float: left; display: inline; height: 29px; line-height: 29px; text-transform: uppercase; margin-right: 3px }
#navigation1 li.last { margin-right: 0; }
#navigation1 li a,
#navigation1 li a span { float: left; display: inline; height: 29px; padding-left: 10px; background-position: 0 0; color: #919191; }
#navigation1 li a span { padding-left: 0; padding-right: 10px;  background-position: right 0; }
#navigation1 ul.sf-menu li a:hover,
#navigation1 ul.sf-menu li a:hover span { background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0l6G-DlffTVg-sBpANCNHrWW_gkGUUbkkIC3HRla8lraZqaeO9UewS46mPNcDkg_uHlmcQCumQiAjaIx7kIpaLOCD-bUAK5EBas6bIEnPhk9MdjquYRZmhMStttZyGnNqmSIC4zPjDV4/s1600/bt_nav_hover.png); text-decoration: none; color: #fff; }
#navigation1 li a.clicked,
#navigation1 li a.clicked span { background-position: 0 bottom }
#navigation1 li a.clicked span { background-position: right bottom; }

6. Go to blogger and click Layout

7. Click Add Gadget and select 'HTML/Javascript

8. Paste below code.

<div id="navigation1">
<ul class="sf-menu sf-js-enabled sf-shadow">
<li class="cat-item cat-item-29"><a title="Home" href="#"><span>HOME</span></a></li>
<li class="cat-item cat-item-29"><a href="#" title="Graphics"><span>Graphics</span></a></li>
<li class="cat-item cat-item-31"><a href="#" title="Coding"><span>Coding</span></a></li>
<li class="cat-item cat-item-18"><a href="#" title="inspiration"><span>inspiration</span></a> </li>
<li class="cat-item cat-item-1"> <a href="#" title="Photography"><span>Photography</span></a></li>
<li class="cat-item cat-item-30"><a href="#" title="Freebies"><span>Blogger</span></a></li>
<li class="cat-item cat-item-19"><a href="#" title="Wordpress"><span>Wordpress</span></a></li>
<li class="cat-item cat-item-25"><a href="#" title="Logo"><span>Logo</span></a></li>
<li class="cat-item cat-item-22"><a href="#" title="Contact"><span>Contact</span></a>
</li></ul></div>

Replace # with your links.

9. Now save your HTML/Javascript'.

You are done. If you have any problem related to this Css3 Dark blue navigation bar. Just leave a comment.I will help to you.

Itulah sedikit Artikel Css3 Dark Blue Navigation Bar For Blogger terbaru dari kami

Semoga artikel Css3 Dark Blue Navigation Bar For Blogger yang saya posting kali ini, bisa memberi informasi untuk anda semua yang menyukai Android Apps For Free. jangan lupa baca juga artikel-artikel lain dari kami.

Terima kasih Anda baru saja membaca Css3 Dark Blue Navigation Bar For Blogger