| Profil de 雅清小妖ㄣ素材便利PhotosBlogListes | Aide |
|
29 octobre 彩色滚动条(2)使用方法:复制~粘贴
女巫根据Loadmemory的教程修改后配色为己用的滚动文本框代码,效果如下: 这是小女巫测试修改后的颜色搭配 把代码拷贝后可直接双击文本框就可以在里面输入文字和粘贴图片,而且文本框的大小可以随意调整。 具体效果看以下链接:查看效果 <DIV align=center 代码实现的文本框是浅黄色的背景,粗略效果如文本框内所示。 (注释:附语法语句的解释: //层开始标记,对中对齐 PS:特别感谢百忙中提供我帮助帮我解惑的偶的朋友TOLLY!)
另附各句的语法解释:
align=center 表示框内内容居中对齐,缺省情况下为左对齐。
background-color: transprant; 表示框内背景色为透明,需要改颜色的话,把transprant改成16进制颜色值即可。
border: solid 2px black表示文本框的边线状态,solid表示实线,可选的值有dashed(虚线),double(双线),outset等。 2px black分别表示边线粗细和颜色,可自行调整(注:black和#000000效果一样)
width: 355px; height: 200px; 分别表示滚动文本框的宽和高。
overflow: auto;auto表示"自动",即框内内容不需要占据height: 200px这么高的高度时,就不会出现滚动条,一旦超过了,滚动条就会出现,多出的部分通过下拉滚动条来显示,overflow也设置的值还有scroll,即强制出现滚动条,因为这样也会强制出现横向的滚动条,很难看。
后面那部分代码,就是设置滚动条的颜色状态,根据自己的需要和喜好来调整,比较有用的是scrollbar-face-color: #889B9F;这句,其他部分不改也问题不大。
附八度的教学如下: 文本滾動框的源代碼: <DIV align=center>
最後介紹八度經常用的「簡化版文本滾動框」,去掉了上面的那些複雜語句,就可以簡簡單單的一個框框免除過多的花巧: <DIV align=center><FONT style="FONT-SIZE: 11pt; OVERFLOW: auto; WIDTH: 90.62%; FONT-FAMILY: times new roman; HEIGHT: 87px" face="Courier New, Courier, Monospace" color=#9933cc>
最後特別注意兩點: 代码:
<DIV style="BORDER-RIGHT: black 2px solid; BORDER-TOP: black 2px solid; SCROLLBAR-FACE-COLOR: #006600; SCROLLBAR-HIGHLIGHT-COLOR: #33cc33; OVERFLOW: scroll; BORDER-LEFT: black 2px solid; WIDTH: 378px; SCROLLBAR-SHADOW-COLOR: #33cc33; COLOR: #006600; SCROLLBAR-3DLIGHT-COLOR: #33cc33; SCROLLBAR-ARROW-COLOR: #33cc33; BORDER-BOTTOM: black 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #33cc33; HEIGHT: 111px; BACKGROUND-COLOR: #ccffcc" align=center> <DIV align=left><FONT color=#009900></FONT> 文字</DIV></DIV></DIV>
代码:
<DIV style="BORDER-RIGHT: black 2px solid; BORDER-TOP: black 2px solid; SCROLLBAR-FACE-COLOR: #66ff66; SCROLLBAR-HIGHLIGHT-COLOR: #66ff99; OVERFLOW: scroll; BORDER-LEFT: black 2px solid; WIDTH: 378px; SCROLLBAR-SHADOW-COLOR: #00ff00; COLOR: #006600; SCROLLBAR-3DLIGHT-COLOR: #66ff99; SCROLLBAR-ARROW-COLOR: #009900; BORDER-BOTTOM: black 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #00ff00; HEIGHT: 111px; BACKGROUND-COLOR: #ccffcc" align=center> <DIV align=left><FONT color=#009900></FONT> 文字</DIV></DIV> <DIV></DIV>
代码: <DIV align=center>
代码: <DIV style="BORDER-RIGHT: black 2px solid; BORDER-TOP: black 2px solid; SCROLLBAR-FACE-COLOR: #000000; SCROLLBAR-HIGHLIGHT-COLOR: #000000; OVERFLOW: auto; BORDER-LEFT: black 2px solid; WIDTH: 372px; SCROLLBAR-SHADOW-COLOR: #ffffff; COLOR: #000000; SCROLLBAR-ARROW-COLOR: #000000; BORDER-BOTTOM: black 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #000000; HEIGHT: 319px; BACKGROUND-COLOR: #000000">
代码:
<DIV style="BORDER-RIGHT: #ff9999 2px solid; BORDER-TOP: #ff9999 2px solid; SCROLLBAR-FACE-COLOR: #ffcccc; SCROLLBAR-HIGHLIGHT-COLOR: #ff9999; OVERFLOW: scroll; BORDER-LEFT: #ff9999 2px solid; WIDTH: 355px; SCROLLBAR-SHADOW-COLOR: #ff9999; COLOR: #ffcccc; SCROLLBAR-3DLIGHT-COLOR: #ffcccc; SCROLLBAR-ARROW-COLOR: #ffcccc; BORDER-BOTTOM: #ff9999 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #ffcc99; HEIGHT: 88px; BACKGROUND-COLOR: #ffcccc" align=center> <DIV align=left><FONT color=#009900></FONT><FONT color=#ff6699> 文字</FONT></DIV></DIV> 代码:
<DIV style="BORDER-RIGHT: #ff9999 2px solid; BORDER-TOP: #ff9999 2px solid; SCROLLBAR-FACE-COLOR: #ffccff; SCROLLBAR-HIGHLIGHT-COLOR: #ff99cc; OVERFLOW: scroll; BORDER-LEFT: #ff9999 2px solid; WIDTH: 378px; SCROLLBAR-SHADOW-COLOR: #ff99cc; COLOR: #ffcccc; SCROLLBAR-3DLIGHT-COLOR: #ffcccc; SCROLLBAR-ARROW-COLOR: #ff99cc; BORDER-BOTTOM: #ff9999 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #ffccff; HEIGHT: 111px; BACKGROUND-COLOR: #ffccff" align=center> <DIV align=left><FONT color=#009900></FONT><FONT color=#ff00ff> 文字</FONT></DIV></DIV>
代码:
<DIV style="BORDER-RIGHT: #ff9999 2px solid; BORDER-TOP: #ff9999 2px solid; SCROLLBAR-FACE-COLOR: #ffcc99; SCROLLBAR-HIGHLIGHT-COLOR: #ff9966; OVERFLOW: scroll; BORDER-LEFT: #ff9999 2px solid; WIDTH: 378px; SCROLLBAR-SHADOW-COLOR: #ff9966; COLOR: #ffcccc; SCROLLBAR-3DLIGHT-COLOR: #ffcc99; SCROLLBAR-ARROW-COLOR: #ff9966; BORDER-BOTTOM: #ff9999 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #ffcc99; HEIGHT: 111px; BACKGROUND-COLOR: #ffcc99" align=center> <DIV align=left><FONT color=#009900></FONT><FONT color=#ff3300> 文字</FONT></DIV></DIV>
代码:
<DIV style="BORDER-RIGHT: #ffcc99 2px solid; BORDER-TOP: #ffcc99 2px solid; SCROLLBAR-FACE-COLOR: #ffffcc; SCROLLBAR-HIGHLIGHT-COLOR: #ffcc99; OVERFLOW: scroll; BORDER-LEFT: #ffcc99 2px solid; WIDTH: 378px; SCROLLBAR-SHADOW-COLOR: #ffcc99; COLOR: #ffcc99; SCROLLBAR-3DLIGHT-COLOR: #ffffcc; SCROLLBAR-ARROW-COLOR: #ffcc99; BORDER-BOTTOM: #ffcc99 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #ffffcc; HEIGHT: 111px; BACKGROUND-COLOR: #ffffcc" align=center> <DIV align=left><FONT color=#009900></FONT> 文字</DIV></DIV>
代码:
<DIV style="BORDER-RIGHT: #9966ff 2px solid; BORDER-TOP: #9966ff 2px solid; SCROLLBAR-FACE-COLOR: #9999ff; SCROLLBAR-HIGHLIGHT-COLOR: #9966ff; OVERFLOW: scroll; BORDER-LEFT: #9966ff 2px solid; WIDTH: 378px; SCROLLBAR-SHADOW-COLOR: #9966ff; COLOR: #ffcc99; SCROLLBAR-3DLIGHT-COLOR: #9999ff; SCROLLBAR-ARROW-COLOR: #6633ff; BORDER-BOTTOM: #9966ff 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #9999ff; HEIGHT: 111px; BACKGROUND-COLOR: #9999ff" align=center></DIV> 代码:
<DIV style="BORDER-RIGHT: #2d0f00 2pt dashed; BORDER-TOP: #2d0f00 2pt dashed; SCROLLBAR-HIGHLIGHT-COLOR: #999999; OVERFLOW: scroll; BORDER-LEFT: #2d0f00 2pt dashed; WIDTH: 256px; SCROLLBAR-SHADOW-COLOR: #000000; COLOR: #ffffff; SCROLLBAR-3DLIGHT-COLOR: #c3c3b4; SCROLLBAR-ARROW-COLOR: #000000; BORDER-BOTTOM: #2d0f00 2pt dashed; SCROLLBAR-DARKSHADOW-COLOR: #c3c3b4; HEIGHT: 67px; BACKGROUND-COLOR: #c3c3b4; SCROLLBAR-: #c3c3b4"></DIV> Commentaires (33)Pour ajouter un commentaire, connectez-vous avec votre identifiant Windows Live ID (si vous utilisez Messenger ou Xbox LIVE, vous avez un identifiant Windows Live ID). Connectez-vous Vous n'avez pas d'identifiant Windows Live ID ? Inscrivez-vous
Rétroliens (1)L'URL de rétrolien de ce billet est : http://yaojinlin.spaces.live.com/blog/cns!529844EAFB2ABBC7!1048.trak Blogs Web qui font référence à ce billet
|
|
|