Reminisce .

教学 ♥ 美化 scrollbar

11 February 2012 @ 7:52 PM

转帖请留言和附上链接 ♥

左边的是普通 scrollbar
右边的是美化后的 scrollbar

最近会发一系列关于 scrollbar 的教学哦 :D

这个教学呢

Blogger Template & Blogskin 都可以 (:

步骤 1

Blogger Template :

Design - Edit HTML

用 ctrl +f 找 :

a:link {

在它上面放入代码 .

Blogskin :

Template - Edit html

用 ctrl +f 找 :

<style type="text/css">

在它下面放入代码 .

步骤 2

代码 :

::-webkit-scrollbar {
height: 15px;
width: 15px;
background: #ffffff;
}
::-webkit-scrollbar-thumb {
border: 2px solid #000000;
background:#ffffff;
}

红色的是 scrollbar 的高度 .

蓝色的是 scrollbar 的宽度 .

紫色的是 scrollbar 框框的粗细度 .

粉红色 highlight 的是 scrollbar 框框的种类 .

灰色 highlight 的是 scrollbar 框框的颜色 .

其他的 , 请参考以下图片:

步骤 3

保存 Save .

任何疑问请在 tagboard 留言 .

在评论箱留言请告诉我 (: