☼ Cách tiến hành:
1- Đăng nhập vào Blog
2- Vào thiết kế
3- Chọn Chỉnh sử HTML (Không cần mở rộng tiện ích mẫu)
4- Thêm đoạn code sau vào trước thẻ ]]></b:skin> .#foxmenucontainer{ height:29px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZKmqWwGHHCWmzcgVRwMJdV2SWLeESaCX5gLcBjQKzL22HRmZe2c-WuujyyjcxSvS6h63GotW1YzbTHw-G_T1_nZZDDYwSQQgBwgTa5X5xCfPZqVmWrcFkbCv5M95_3nkz3VVPy_OOpArn/s1600/menu-namkna-blogspot.jpg) repeat-x; display:block; padding:0px 0 0px 0px; border-top:1px solid #474747; font: 14px "Century gothic",verdana, Arial, sans-serif; font-weight:normal; } #menu ,#menu ul { margin: 0px 5px; padding: 0px; list-style: none; height:29px; } #menu a { color: #B3DBEF; display: block; font-weight: normal; padding: 4px 10px 6px 10px; } #menu a:hover { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4pxmstxRzei736hhZgGBLfWm0n4xlb0GhPej9r-oJA62mXNW5Ta6lHyO_uLZZqmg0WyjxdMBDIQICh941oSvLKfsjVKHDDa0jVh0HPA64qUCcp3XtUwBtiaYypLDfFnF6h00BQOV8AdEn/s1600/menuhov-namkna-blogspot.jpg) repeat-x; color: #fff; display: block; text-decoration: none; } #menu li { float: left; margin: 0px 0 0px 0; padding: 0px; } #menu li li { float: left; margin: px 0px 0px 5px; padding: 0px; width: 130px; } #menu li li a, #menu li li a:link, #menu li li a:visited { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZKmqWwGHHCWmzcgVRwMJdV2SWLeESaCX5gLcBjQKzL22HRmZe2c-WuujyyjcxSvS6h63GotW1YzbTHw-G_T1_nZZDDYwSQQgBwgTa5X5xCfPZqVmWrcFkbCv5M95_3nkz3VVPy_OOpArn/s1600/menu-namkna-blogspot.jpg) repeat-x; width: 150px; float: none; margin: 0px; padding: 4px 10px 5px 10px; color:#fff; } #menu li li a:hover, #menu li li a:active { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4pxmstxRzei736hhZgGBLfWm0n4xlb0GhPej9r-oJA62mXNW5Ta6lHyO_uLZZqmg0WyjxdMBDIQICh941oSvLKfsjVKHDDa0jVh0HPA64qUCcp3XtUwBtiaYypLDfFnF6h00BQOV8AdEn/s1600/menuhov-namkna-blogspot.jpg) repeat-x; width: 150px; float: none; margin: 0px; padding: 4px 10px 5px 10px; color:#06415F; } #menu li ul { position: absolute; width: 10em; left: -999em; z-index:1; } #menu li:hover ul { left: auto; display: block; } #menu li:hover ul, #menu li.sfhover ul { left: auto; }
6- Lưu lại Lưu mẫu
7- Thêm 1 HTML/Javarscrip và dán vào (hoặc chèn vào trước thẻ </header> .)
<div id="foxmenucontainer"> <div id="menu"> <ul> <li><a expr:href="data:blog.homepageUrl">Home</a></li> <li><a href="#" title="#">About</a></li> <li><a href="#" title="#">WebDesign</a> <ul> <li><a href="#" title="#">HTML</a></li> <li><a href="#" title="#">CSS</a></li> <li><a href="#" title="#">JavaScript</a></li> </ul> </li> <li><a href="#" title="#">Subscribe</a></li> <li><a href="#" title="#">Register</a></li> <li><a href="#" title="#">Contact</a></li> </ul> </div> </div>Sau đó bấm Lưu
Chúcthành công!
0 nhận xét:
Đăng nhận xét