20 September 2011

【blogger】如何为archive做scrollbar

我不大会解释,大家看我的部落格便知道了。


方法
1)去Dashboard > Design > Edit Html >打钩 Expand Widgets template
2)按Ctrl + F 来找以下代码:
<div id='ArchiveList'>
3)在以上代码的上面你会看到<div class='widget-content'> 这个代码
4)用以下的代码来代替<div class='widget-content'>这个代码:
<div class='widget-content' style='overflow:auto; height:200px'>
5)保存,完成!

效果

【blogger】如何为scrollbar变颜色+美化

我不知道有没有人喜欢我这个blog的scrollbar   XD
不过我会教大家如何做这个美化

这个是普通的scrollbar。


这是修改后的scrollbar


方法
1)backup你的template
2)dashboard > design > edit html > tick expand widget
3)按CTRL+F,找这个代码:
]]></b:skin>
4)在该代码的上面放以下代码
::-webkit-scrollbar {
height:12px;
width: 12px;
background: #F778A1;
}
::-webkit-scrollbar-thumb {
background-color: #FDEEF4;
-moz-border-radius: 10px;
border-radius: 10px;
}
5)preview,保存,完成


笔记1
当然,有些东西是可以改的。。
这个网站来找你要的HTML颜色代码   【例子= #0B3B24
然后代替以上红色的代码。
自己试验吧~~


笔记2
如果要这样的效果的话
把 border-radius: 10px; 的 10 换去 1。
保存,完成!