注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

静坐红尘,看烟雨

用淡淡的文字记录远走的时光

 
 
 

日志

 
 

引用 添加滚动条代码  

2008-12-08 21:45:52|  分类: 博客技巧 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

引用

hongxue82添加滚动条代码

下面是本博客添加滚动条代码,以及说明:
<DIV style="BORDER: black 0px solid; OVERFLOW: scroll; OVERFLOW-X: hidden; DIRECTION: rtl; WIDTH: 215px; HEIGHT: 325px; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-FACE-COLOR: #d5d7d9; SCROLLBAR-DARKSHADOW-COLOR: #000000; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; SCROLLBAR-3DLIGHT-COLOR: #d5d7d9; SCROLLBAR-SHADOW-COLOR: #ffffff; SCROLLBAR-TRACK-COLOR: #d5d7d9" align=left>
<DIV>●<A href="http://blog.163.com/gsd_432427/" target=_blank>海珠儿blog</A>●</DIV>
<DIV>●<A href="http://gztr.2008.blog.163.com/" target=_blank>春暖花会开的blog</A>●</DIV>
<DIV>●<A href="http://hongxue82.blog.163.com/" target=_blank>一风轻扬</A>●</DIV>
</DIV>


代码说明:
BORDER: black 0px solid;这个是边框,选择默认就可以了
 OVERFLOW: scroll; OVERFLOW-X: hidden:这个是滚动条属性设置,选择默认就好了
WIDTH: 215px; HEIGHT: 325px:表示你所要添加加滚动条模块的宽和长
DIRECTION:滚动条位置,rtl表示左边, ltr表示右边.

下面是滚动条颜色设置:
SCROLLBAR-FACE-COLOR: 滚动条凸出部分的颜色
SCROLLBAR-HIGHLIGHT-COLOR: 滚动条空白部分的颜色
SCROLLBAR-SHADOW-COLOR: 立体滚动条阴影的颜色
SCROLLBAR-3DLIGHT-COLOR: 滚动条亮边的颜色
SCROLLBAR-ARROW-COLOR: 上下按钮上三角箭头的颜色
SCROLLBAR-TRACK-COLOR: 滚动条的背景颜色
SCROLLBAR-DARKSHADOW-COLOR: 滚动条强阴影的颜色
最后align=left这个对齐方式,是指添加滚动条的模块内文字的对齐方式,left:是左边,right:是右边.

 

另:下面和右边带滚动条代码:
<DIV style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; SCROLLBAR-FACE-COLOR: red; SCROLLBAR-HIGHLIGHT-COLOR:#000000; OVERFLOW: scroll; BORDER-LEFT: 1px solid; WIDTH: 214px; SCROLLBAR-SHADOW-COLOR: #000000; COLOR: red; SCROLLBAR-3DLIGHT-COLOR: #000000; SCROLLBAR-ARROW-COLOR: #000000; SCROLLBAR-TRACK-COLOR: #000000; BORDER-BOTTOM: 1px solid; SCROLLBAR-DARKSHADOW-COLOR: #000000; HEIGHT: 375px; BACKGROUND-COLOR: #000000"><BR>
<p><A href="http://gztr.2008.blog.163.com/" target=_blank><FONT color=#00ff00><IMG align=left 
src="http://img.blog.163.com/photo/hy98oWcPK8eQE1WrDRiqug==/4264345897166649785.jpg">春暖花会开</p>
<p><A href="http://gztr.2008.blog.163.com/" target=_blank><FONT color=#00ff00><IMG align=left 
src="http://img.blog.163.com/photo/hy98oWcPK8eQE1WrDRiqug==/4264345897166649785.jpg">春暖花会开</p>
<p><A href="http://gztr.2008.blog.163.com/" target=_blank><FONT color=#00ff00><IMG align=left 
src="http://img.blog.163.com/photo/hy98oWcPK8eQE1WrDRiqug==/4264345897166649785.jpg">春暖花会开</p></div>

下面和左边带滚动条代码:
<DIV align=left style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; SCROLLBAR-FACE-COLOR: red; SCROLLBAR-
HIGHLIGHT-COLOR: #000000; OVERFLOW: scroll; DIRECTION: rtl; BORDER-LEFT: 1px solid; WIDTH: 214px; SCROLLBAR-
SHADOW-COLOR: #000000; SCROLLBAR-3DLIGHT-COLOR: #000000; SCROLLBAR-ARROW-COLOR: #000000; SCROLLBAR-TRACK-COLOR: 
#000000; BORDER-BOTTOM: 1px solid; SCROLLBAR-DARKSHADOW-COLOR: #000000; HEIGHT: 375px; BACKGROUND-COLOR: #000000"><BR>
<p><A href="http://gztr.2008.blog.163.com/" target=_blank><FONT color=#00ff00><IMG align=left 
src="http://img.blog.163.com/photo/hy98oWcPK8eQE1WrDRiqug==/4264345897166649785.jpg">春暖花会开</p>
<p><A href="http://gztr.2008.blog.163.com/" target=_blank><FONT color=#00ff00><IMG align=left 
src="http://img.blog.163.com/photo/hy98oWcPK8eQE1WrDRiqug==/4264345897166649785.jpg">春暖花会开</p>
<p><A href="http://gztr.2008.blog.163.com/" target=_blank><FONT color=#00ff00><IMG align=left 
src="http://img.blog.163.com/photo/hy98oWcPK8eQE1WrDRiqug==/4264345897166649785.jpg">春暖花会开</p></div>

代码解释:
align=left:置左(就是内容的位置)
OVERFLOW: scroll;超过范围就自动生成滚动条;
DIRECTION: rtl;将滚动条放置到左边的关键,相反DIRECTION: ltr;就是右边
BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid;边框的宽度;
background-color: #000000;背景色,如果要透明背景就去掉整句;
SCROLLBAR-FACE-COLOR: red;滚动条中间可以拉的部分和箭头旁边部分的颜色;
SCROLLBAR-TRACK-COLOR: #000000;滚动条中间可以拉的部分以外的颜色;
SCROLLBAR-HIGHLIGHT-COLOR: #000000;滚动条左侧边框的颜色(用于显示立体之用);
SCROLLBAR-3DLIGHT-COLOR: #000000;滚动条左侧边框的颜色(用于显示立体之用);
SCROLLBAR-SHADOW-COLOR: #000000;滚动条右侧边框的颜色(用于显示阴影之用);
SCROLLBAR-DARKSHADOW-COLOR: #000000;滚动条右侧边框的颜色(用于显示阴影之用);
SCROLLBAR-ARROW-COLOR: #000000;箭头部分的颜

  评论这张
 
阅读(34)| 评论(1)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017