Pages

Follower :)

Chit-Chat

2011年6月26日

把menu 变成图片

效果图: :
嗯、就是这个
在教程开始之前、先ngap一些废话先
这个教程`````我``拖_________________________了很久一下
没记错的话、应该是在2个月前答应Jelly + 童童发教程的
哪里知道现在才放``paisehh Awh~
打开设计>Edit HTML, 用Ctrl+F寻找以下的code

]]》《《/b:skin》
*《》换去< >

在]]》《《/b:skin》之前,添加以下的code
*《》换去< >
.basictab{


padding: 3px 0;

margin-left: 0;

font: bold 16px Freestyle Script;

list-style-type: none;

text-align: center; /*set to left, center, or right to align the menu as desired*/

}

.basictab li{

display: inline;

margin: 0;

}

.basictab li a{

text-decoration: none;

padding: 3px 7px;

margin-right: 3px;

border: 1px solid gray;

background-color: #f6ffd5 ; /*可自行更换背景颜色*/

color: #2d2b2b;

}

.basictab li a:visited{

color: #2d2b2b;

}

.basictab li a:hover{

background-color: #DBFF6C ; /*可自行更换背景颜色*/

color: black;

}

.basictab li a:active{

color: black;

}

.basictab li.selected a{ /*selected tab effect*/

position: relative;

top: 1px;

padding-top: 4px;

background-color: #DBFF6C ; /*可自行更换背景颜色*/

color: black;

}

Well、再打开设计>页面元素>添加小工具>HTML/JavaScript
把以下的代码paste下去
《center》


《ul class="basictab"》

《li class="selected"》《a href="网址1"》标题1《/a》《/li》

《li》《a href="网址2"》标题2《/a》《/li》

《li》《a href="网址3"》标题3《/a》《/li》

《li》《a href="网址4"》标题4《/a》《/li》

《/ul》

《/center>》
*《》换去< >


Wow!重点来了、((harrr、现在才讲重点?!
要把他们变成图片`只需把《a href="网址1"》标题1《/a》换成
《a href="网址1"》《img src='图片direct link'/》《/a》**记得将《》换成< >
完成后、你的部落格会出现两个页面!
一个是有图片、一个是正常的
正常mean、像以前酱、只有字体出现
你现在需要踢掉、哦不、是干掉、No~!是删掉正常的那个
留下有图片的那个、即可
教程、Habissssss~

1 条评论: