Một số mẫu me nu đẹp

Giới thiệu với các bạn một số mẫu me nu mã đơn giản mà có thể được tùy biến đầy đủ để thực hiện các thay đổi ưa thích của bạn. 
(Trang được lấy từ một trang tiếng Anh, để giữ nguyên mẫu và màu sắc, tôi để cỡ chữ nhỏ)

Live Demo

Về Blogger> Design> Page Elements
Chọn một Widget HTML / JavaScript dưới tiêu đề và dán đoạn mã sau bên trong nó,

<div id='mbtnavbar'>
<ul id='mbtnav'>
<li>
<a href=''> Trang chủ </ a>
</ Li>
<li>
<a href=''> </ a>
</ Li>
<li>
<a href=''> Liên hệ </ a>
</ Li>
<li>
<a href=''> Sitemap </ a>
<ul> 
<li> <a href=''> Sub Trang # 1 </ a> </ li> 
<li> <a href=''> Sub Trang # 2 </ a> </ li> 
<li> <a href=''> Sub Trang # 3 </ a> </ li> 
</ Ul>
</ Li>
</ Ul>
</ Div>

Thay thế # với Trang liên kết của bạn và các văn bản in đậm với những cái tên trang có liên quan. Mã màu vàng đánh dấu là chịu trách nhiệm cho trình đơn thả xuống. Bạn có thể sao chép và dán nó dưới bất kỳ tab nào bạn muốn ngay trước khi </ li> 
Để thêm một tab khác chỉ cần dán mã này trên </ ul> 

<li>
<a href=''> Tab Name </ a>
</ Li> 

3. Go Thiết kế> Edit HTML 
4. Sao lưu mẫu của bạn và tìm kiếm, 

]]> </ B: skin>

3. Chỉ cần ở trên nó dán mã dưới đây, 

/ * ----- MBT Drop Down Menu ---- * /

# Mbtnavbar {
background: # 060.505;
width: 960px;
color: # FFF;
margin: 0px;
padding: 0;
vị trí: tương đối;
biên giới-top: 0px solid # 960.100;
height: 35px;
}

# Mbtnav {
margin: 0;
padding: 0;
}
# Mbtnav ul {
float: left;
list-style: none;
margin: 0;
padding: 0;
}
# Mbtnav li {
list-style: none;
margin: 0;
padding: 0;
biên giới-left: 1px solid # 333;
cửa quyền: 1px solid # 333;
height: 35px;
}
# Mbtnav li a, # mbtnav li a: liên kết, # mbtnav li a: visited {
color: # FFF;
display: block;
font: bình thường 12px Helvetica, sans-serif; margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;

}
# Mbtnav li a: hover, # mbtnav li a: active {
background: # BF0100;
color: # FFF;
display: block;
text-decoration: none;
margin: 0;
padding: 9px 12px 10px 12px;



}
# Mbtnav li {
float: left;
padding: 0;
}
# Mbtnav li ul {
z-index: 9999;
vị trí: tuyệt đối;
còn lại:-999em;
height: auto;
width: 160px;
margin: 0;
padding: 0;
}
# Mbtnav li ul a {
width: 140px;
}
# Mbtnav li ul ul {
margin: 25px 0 0 161px;
}
# Mbtnav li: hover ul ul, # mbtnav li: hover ul ul ul, # mbtnav li.sfhover ul ul, # mbtnav li.sfhover ul ul ul {
còn lại:-999em;
}
# Mbtnav li: hover ul, # mbtnav li li: hover ul, # mbtnav li li li: hover ul, ul # mbtnav li.sfhover, # mbtnav li li.sfhover ul, # mbtnav li li li.sfhover ul {
left: auto;
}
# Mbtnav li: hover, # mbtnav li.sfhover {
vị trí: static;
}
# Mbtnav li li a, # mbtnav li li: liên kết, # mbtnav li li a: visited {
background: # BF0100;
width: 120px;
color: # FFF;
display: block;
font: bình thường 12px Helvetica, sans-serif;
margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
z-index: 9999;
cửa dưới: 1px dotted # 333;

}
# Mbtnav li li a: hover, # mbtnavli li a: active {
background: # 060.505;
color: # FFF;
display: block; margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
}

Thực hiện những thay đổi này: 

• Thay đổi # 060.505 để thay đổi màu nền của menu chính
• Thay đổi văn bản đánh dấu màu vàng để thay đổi font màu sắc, kích thước và gia đình
• Thay đổi # BF0100 để thay đổi nền của một thẻ trên chuột di chuột
• Thay đổi # BF0100 để thay đổi màu nền của trình đơn thả xuống
• Thay đổi # 060.505 để thay đổi màu nền của trình đơn thả xuống trên chuột di chuột

4. Lưu mẫu của bạn và bạn đã làm xong! 

THỦ THUẬT 05:09