Xivanki Share !!: Cara Membuat Menu Di Blogspot Dengan Hover Effect Css

Cara Membuat Menu Di Blogspot Dengan Hover Effect Css - Selamat datang di situs media global terbaru Xivanki, Pada halaman ini kami menyajikan informasi tentang Cara Membuat Menu Di Blogspot Dengan Hover Effect Css !! Semoga tulisan dengan kategori Edit Menu !! ini bermanfaat bagi anda. Silahkan sebarluaskan postingan Cara Membuat Menu Di Blogspot Dengan Hover Effect Css ini ke social media anda, Semoga rezeki berlimpah ikut dimudahkan Allah bagi anda, Lebih jelas infonya lansung dibawah -->

Cara Menu Di Blogspot Dengan Hover Effect Css - Ini adalah Menu Blogspot Dengan Underline Hover Efek Css Navigasi Bar. Pada tutorial ini saya akan menjelaskan, bagaimana caranya menambahkannya ke blogger. Menu ini bisa bekerja dengan setiap browser modern yang sobat pakai. Sobat dapat menghubungkan dengan halaman utama sobat dengan menggunakan
bar navigasi ini. Menu ini menggunakan CSS3 dan HTML. Untuk lebih jelasnya lihat demo nya langsung ya :

Okey, berikut ini cara memasang Menu Di Blogspot Dengan Hover Effect Css :


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 */


#arrowunderlinebtrix{
list-style-type:none;
margin:0;
padding:0;
text-align:center; 
font: bold 16px Georgia;
}

#arrowunderlinebtrix li{
display:inline;
margin-right:25px; 
}

#arrowunderlinebtrix li a{
position:relative;
color:black;
padding-bottom:8px; 
text-decoration:none;

}

#arrowunderlinebtrix li a:hover{
border-bottom:3px solid #25bd0d; 
}

#arrowunderlinebtrix li a:hover:after{ 
content:'';
width:0;
height:0;
position:absolute;
left:50%;
margin-left:-5px; 
bottom: 0;
border-width:5px; 
border-style:solid;
border-color: transparent transparent #25bd0d transparent; 
}

6. Go to blogger and click Layout

7. Click Add Gadget and select 'HTML/Javascript

8. Paste below code.

<div id="arrowunderline">
<ul>
<li><a href="#"><span>Home</span></a></li>
<li><a href="#"><span>Download</span></a></li>
<li><a href="#"><span>CSS</span></a></li>
<li><a href="#"><span>About</span></a></li>
<li><a href="http://www.bloggertrix.com/"><span>Contact Us</span></a></li>
</ul>
</div>

Replace # with your links.

9. Sekarang save HTML/Javascript'.

Nah, saya rasa sudah cukup sob, selamat mencoba membuat menu Di Blogspot Dengan Hover Effect Css. 

Semoga bermanfaat