Menu đơn hiệu ứng đẹp cho blogger

Đây là dạng menu đơn với hình thức khá đẹp mắt sử dụng hoàn toàn bằng CSS nên không ảnh hưởng tới tốc độ load trang của blog
Xem thử:

DEMO

Làm thế nào để thêm menu này vào blogger

Cũng khá đơn giản vì bạn chỉ cần thêm 1 tiện ích rồi bố trí tiện ích này ở vị trí thích hợp tùy theo yêu cầu blog của bạn

<style>

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

.btrix_glossymenu1{

position: relative;padding: 0 0 0 34px;margin: 0 auto 0 auto;

background: url(http://2.bp.blogspot.com/-qGp4yDwRwGw/UdI-am9fKCI/AAAAAAAAhg0/atyOiUswufg/s46/btrix_menupu_bg.gif) repeat-x; 

height: 46px;

list-style: none;

}

.btrix_glossymenu1 li{

float:left;

}

.btrix_glossymenu1 li a{

float: left;display: block;color:#000;

text-decoration: none;

font-family: sans-serif;

font-size: 13px;

font-weight: bold;

padding:0 0 0 16px; 

height: 46px;

line-height: 46px;

text-align: center;

cursor: pointer; 

}

.btrix_glossymenu1 li a b{

float: left;display: block;padding: 0 24px 0 8px; 

}

.btrix_glossymenu1 li.current a, .btrix_glossymenu1 li a:hover{

color: #fff;

background: url(http://1.bp.blogspot.com/-BByMYECtCFg/UdI-uSm3gbI/AAAAAAAAhg8/fhfJi9P_3B4/s46/btrix_menupu_hover_left.gif) no-repeat;

background-position: left;

}

.btrix_glossymenu1 li.current a b, .btrix_glossymenu1 li a:hover b{

color: #fff;

background: url(http://4.bp.blogspot.com/-bLRNkvSt8vA/UdI-8WwL9DI/AAAAAAAAhhE/9YeZQLzwIVc/s250/btrix_menupu_hover_right.gif) no-repeat right top;

}</style>

<ul class="btrix_glossymenu1">

<li class="current"><a href="#"><b>Home</b></a></li>

<li><a href="#"><b>CSS</b></a></li>

<li><a href="#"><b>Forums</b></a></li> 

<li><a href="#"><b>Webmaster Tools</b></a></li> 

<li><a href="#"><b>JavaScript</b></a></li> 

<li><a href="#"><b>Contact Us</b></a></li> 

</ul>

Và nhớ thay # là các liên kết(URL) nhãn cần tới.
Chúc thành công.