给层添加滚动条及滚动条样式

来源：互联网发布：小米手机预装软件编辑：程序博客网时间：2024/06/11 22:34

给层添加滚动条及滚动条样式

不是内联框架,给层添加滚动条,本人觉得比内联框架好用,以及给网页滚动条定义样式,,

红色为重点

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">/*(给整张页面设置滚动条模式,这个起到决定作用,如果你是<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 1.0 Transitional//EN">,这效果就不出来了,不知道为啥,这是个头痛的问题,所以米事,别把整个页面的滚动条设定样式,或许会有复作用,不过层的滚动条这边不用改也能出来)*/
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
body {
   margin:0px;
    SCROLLBAR-FACE-COLOR:#4e9303; /*滚动条凸出部分的颜色*/
    SCROLLBAR-HIGHLIGHT-COLOR:#ccc; /*滚动条空白部分的颜色*/
    SCROLLBAR-SHADOW-COLOR:#ccc; /*立体滚动条阴影的颜色*/
SCROLLBAR-3DLIGHT-COLOR:#587c00; /*滚动条亮边的颜色*/
    SCROLLBAR-ARROW-COLOR:#b4ff00; /*上下按钮上三角箭头的颜色*/
    SCROLLBAR-BASE-COLOR:#000; /*滚动条的基本颜色*/
    SCROLLBAR-DARK-SHADOW-COLOR:#fff; /*滚动条强阴影的颜色*/
}

.pag{ width:1000px; height:800px; padding-top:30px; padding-left:350px;}
.scroll{ width:500px; height:200px; border:1px #cccccc solid; overflow:scroll; overflow-x:hidden;
}/*overflow:scroll; 设置是否滚动,overflow-x:hidden;设置横向无滚动条,如果你设置
overflow-y:hidden;那就是纵向无滚动条啦*/

</style></head>

<body>
<div class="pag">
<div class="scroll">我是一个滚动条,我滚滚滚,<br>滚<br>滚<br>滚<br>滚<br>滚<br>滚<br>滚<br>滚<br>滚<br>滚<br>滚<br>滚<br>滚<br>滚<br>滚<br>滚<br>滚</div>
</div>
</body>
</html>

效果图

0 0