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

很想大家呐

 只要朝着阳光,便不会看见阴影。

 
 
 

日志

 
 

引用 (原创)教程——DIY滚动条设置  

2010-04-18 17:28:33|  分类: 幻※素材库 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

 

引用

奶茶の猫猫(原创)教程——DIY滚动条设置
      
       说到滚动条,那真是复杂啊~,代码又长又复杂~但是呢,在猫猫辛苦地钻研下,终于攻破了难关!~ 好了,现在开始讲解喽,要认真听讲哦~
首先给大家一个初始的代码(就是日志上的这个滚动条代码):
<DIV style="BORDER-RIGHT: pink 5px dotted; BORDER-TOP: pink 5px dotted; SCROLLBAR-FACE-COLOR: #f09cc3; OVERFLOW: scroll; BORDER-LEFT: pink 5px dotted; WIDTH: 150px; SCROLLBAR-SHADOW-COLOR: #f7cbdf; COLOR: #f7cbdf; SCROLLBAR-3DLIGHT-COLOR: #f7cbdf; SCROLLBAR-ARROW-COLOR: #f7cbdf; BORDER-BOTTOM: pink 5px dotted; SCROLLBAR-DARKSHADOW-COLOR: #f7cbdf; HEIGHT: 100px; BACKGROUND-COLOR: #fefafc" align=center><FONT color=#000000>输入文字</FONT></DIV>
有颜色的部分就是可以修改的地方~
每调完一部,就点预览看看效果哦~
首先添加一篇日志,点击引用 (原创)教程——DIY滚动条设置 - 水银灯※梦幻音符 - 蔷薇水晶,“全部功能”再点击引用 (原创)教程——DIY滚动条设置 - 水银灯※梦幻音符 - 蔷薇水晶,,复制上面的初始代码上去,
现在可以调整代码咯~
红色部分(宽度及高度):WIDTH后面是宽度,HEIGHT后面是高度,输入相应的数字,再点“预览”慢慢调试吧~
蓝色部分(边框类型):这个部分可以换成 none,dotted,dashed,solid,double,groove,ridge,inset,window-inset,outset 几种类型,效果自己看~
紫色部分(滚动条颜色):滚动条有四个边,因此四个边都要输入颜色代码哦~
绿色部分(背景颜色):输入颜色代码调试~
褐色部分(滚动条文字颜色):也是输入颜色代码~
黄色部分的地方都是其他的颜色代码,这些地方大家自己来~
粉色部分(边框颜色)这里就是在考大家的英语了,输入相关颜色的英文字母拼写哦~
橙色部分(框框大小)输入数字调试~
调试得差不多喽,再点击一下引用 (原创)教程——DIY滚动条设置 - 水银灯※梦幻音符 - 蔷薇水晶,,再日志里对里面的字可以再调整,例如让字居中等......
调试完毕后,又点一次引用 (原创)教程——DIY滚动条设置 - 水银灯※梦幻音符 - 蔷薇水晶,,复制里面的整个代码,那个便是你滚动条的代码喽~
为了大家在调试颜色的时候方便,特别在这里添加了一些颜色代码:
#000000 #000033 #000066 #000099 #0000cc #0000ff
#003300 #003333 #003366 #003399 #0033cc #0033ff
#006600 #006633 #006666 #006699 #0066cc #0066ff
#009900 #009933 #009966 #009999 #0099cc #0099ff
#00cc00 #00cc33 #00cc66 #00cc99 #00cccc #00ccff
#00ff00 #00ff33 #00ff66 #00ff99 #00ffcc #00ffff
 #330000 #330033 #330066 #330099 #3300cc #3300ff
#333300 #333333 #333366 #333399 #3333cc #3333ff
#336600 #336633 #336666 #336699 #3366cc #3366ff
#339900 #339933 #339966 #339999 #3399cc #3399ff
#33cc00 #33cc33 #33cc66 #33cc99 #33cccc #33ccff
#33ff00 #33ff33 #33ff66 #33ff99 #33ffcc #33ffff
#660000 #660033 #660066 #660099 #6600cc #6600ff
#663300 #663333 #663366 #663399 #6633cc #6633ff
#666600 #666633 #666666 #666699 #6666cc #6666ff
#669900 #669933 #669966 #669999 #6699cc #6699ff
#66cc00 #66cc33 #66cc66 #66cc99 #66cccc #66ccff
#66ff00 #66ff33 #66ff66 #66ff99 #66ffcc #66ffff
#990000 #990033 #990066 #990099 #9900cc #9900ff
#993300 #993333 #993366 #993399 #9933cc #9933ff
#996600 #996633 #996666 #996699 #9966cc #9966ff
#999900 #999933 #999966 #999999 #9999cc #9999ff
#99cc00 #99cc33 #99cc66 #99cc99 #99cccc #99ccff
#99ff00 #99ff33 #99ff66 #99ff99 #99ffcc #99ffff
#cc0000 #cc0033 #cc0066 #cc0099 #cc00cc #cc00ff
#cc3300 #cc3333 #cc3366 #cc3399 #cc33cc #cc33ff
#cc6600 #cc6633 #cc6666 #cc6699 #cc66cc #cc66ff
#cc9900 #cc9933 #cc9966 #cc9999 #cccccc #ccccff
#ccff00 #ccff33 #ccff66 #ccff99 #ccffcc #ccffff
#ff0000 #ff0033 #ff0066 #ff0099 #ff00cc #ff00ff
#ff3300 #ff3333 #ff3366 #ff3399 #ff33cc #ff33ff
#ff6600 #ff6633 #ff6666 #ff6699 #ff66cc #ff66ff
#ff9900 #ff9933 #ff9966 #ff9999 #ff99cc #ff99ff
#ffcc00 #ffcc33 #ffcc66 #ffcc99 #ffcccc #ffccff
#ffff00 #ffff33 #ffff66 #ffff99 #ffffcc #ffffff
 
好了,就是这样喽,希望大家快快设置好滚动条啦~如果还不懂,留言给我就是了呢~
 

 

 

 

 

 

引用 (原创)教程——DIY滚动条设置 - 水银灯※梦幻音符 - 蔷薇水晶,

 

引用 (原创)教程——DIY滚动条设置 - 水银灯※梦幻音符 - 蔷薇水晶,

猫猫声明:

本素材/教程完全由猫猫原创制作,要全篇拿走请使用引用通告或者标明此Logo

引用 (原创)教程——DIY滚动条设置 - 水银灯※梦幻音符 - 蔷薇水晶,

喜欢的话要留言哦!!!

 

 
  评论这张
 
阅读(46)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

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

页脚

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