IE下的滚动条样式自定义

IE是最早提供滚动条的样式支持，嗯，好多年了，但是其它浏览器一直没有支持，IE独孤求败了。

这些样式规则很简单：

 代码如下 复制代码

scrollbar-arrow-color: color; /*三角箭头的颜色*/
scrollbar-face-color: color; /*立体滚动条的颜色（包括箭头部分的背景色）*/
scrollbar-3dlight-color: color; /*立体滚动条亮边的颜色*/
scrollbar-highlight-color: color; /*滚动条的高亮颜色（左阴影？）*/
scrollbar-shadow-color: color; /*立体滚动条阴影的颜色*/
scrollbar-darkshadow-color: color; /*立体滚动条外阴影的颜色*/
scrollbar-track-color: color; /*立体滚动条背景颜色*/
scrollbar-base-color:color; /*滚动条的基色*/

以下代码定义滚动条的样式：

 代码如下 复制代码

<STYLE>
BODY {
SCROLLBAR-FACE-COLOR: #f892cc;        /*滚动条凸出部分的颜色*/
SCROLLBAR-HIGHLIGHT-COLOR: #f256c6;    /*滚动条空白部分的颜色*/
SCROLLBAR-SHADOW-COLOR: #fd76c2;     /*立体滚动条阴影的颜色*/
SCROLLBAR-3DLIGHT-COLOR: #fd76c2;     /*滚动条亮边的颜色*/
SCROLLBAR-ARROW-COLOR: #fd76c2;     /*上下按钮上三角箭头的颜色*/
SCROLLBAR-TRACK-COLOR: #fd76c2;     /*滚动条的背景颜色*/
SCROLLBAR-DARKSHADOW-COLOR: #f629b9;     /*滚动条强阴影的颜色*/
SCROLLBAR-BASE-COLOR: #e9cfe0;     /*滚动条的基本颜色*/
}
</STYLE>

网页中去掉滚动条：

去掉横向滚动条

 代码如下 复制代码
：<body   style='overflow:scroll;overflow-x:hidden'> 

去掉竖向滚动条

 代码如下 复制代码
：<body   style='overflow:scroll;overflow-y:hidden'> 

两个都去掉

 代码如下 复制代码
：<body   scroll="no"> 

框加中去滚动条在name=""后面加 scrolling="No"

时间： 2024-11-18 08:49:23

IE下的滚动条样式自定义的相关文章

CSS自定义滚动条样式

相信很多人都遇到过在设计中自定义滚动条样式的情景,之前我都是努力说服设计师接受浏览器自带的滚动条样式,但是这样只能规避还是解决不了问题,最近在项目中遇到了,正好来总结一下.当然,兼容所有浏览器的滚动条样式目前是不存在的. IE下的滚动条样式 IE是最早提供滚动条的样式支持,嗯,好多年了,但是其它浏览器一直没有支持,IE独孤求败了. 这些样式规则很简单: scrollbar-arrow-color: color; /*三角箭头的颜色*/ scrollbar-face-color: color; /

jquery美化select自定义下拉框样式示例

select默认的样式的确太丑了,不得不让web前端开发人员费工夫来美化它,在网上搜了一个美化的效果,看起来还不错,收集起来已被后用,需要的可以直接拿去. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://w

CSS自定义滚动条样式与颜色

IE的专有属性:  代码如下 复制代码 scrollbar-arrow-color: color; /*三角箭头的颜色*/ scrollbar-face-color: color; /*立体滚动条的颜色(包括箭头部分的背景色)*/ scrollbar-3dlight-color: color; /*立体滚动条亮边的颜色*/ scrollbar-highlight-color: color; /*滚动条的高亮颜色(左阴影?)*/ scrollbar-shadow-color: color; /*立

jQuery滚动条样式插件mCustomScrollbar用法介绍

关于 mCustomScrollbar mCustomScrollbar 是个基于 jQuery UI 的自定义滚动条插件,它可以让你灵活的通过 CSS 定义网页的滚动条,并且垂直和水平两个方向的滚动条都可以定义,它通过Brandon Aaron jquery mouse-wheel plugin 提供了鼠标滚动的支持,并且在滚动的过程中,还可以缓冲滚动使得滚动更加的平滑,还可以自动调整滚动条的位置和定义滚动到的位置等.总之,你知道非常好用就是了,:-) 下载 如何使用 mCustomScrol

Angular从零到一2.5　验证结果的样式自定义

2.5 验证结果的样式自定义 如果我们在开发工具中查看网页源码,可以看到经过渲染后的控件HTML代码,如图 2.11所示.   图 2.11 验证的样式 用户名控件的HTML代码是下面的样子:在验证结果为false时input的样式是ng-invalid: <input   name="username"   class="ng-pristine ng-invalid ng-touched"   required=""   type=&qu

duilib让不同的容器使用不同的滚动条样式

装载请说明原出处,谢谢~~:http://blog.csdn.net/zhuhongshu/article/details/42240569         以前在给一个容器设置横纵向的滚动条时,一直是通过设置xml的Default标签来完成的,但是这样做有个很大的缺点就是,这个窗体里面的所有滚动条的样式只有一种.有些情况下需要为不同容器设置不同的滚动条样式.                  其实duilib已经有这个功能了,在CContainer容器类里面有两个属性:vscrollbarst

Android更改EditText下划线颜色样式的方法

前言 相信大家都知道,当使用AppCompatEditText(Edit Text)时,默认的下划线是跟随系统的#FF4081的颜色值的,通过改变这个值可以改变所有的颜色样式 有时候你想单独定义某一个界面的颜色样式,则可以这样做: 1.在你的build.gradle中添加最新的appcompat库 dependencies { compile 'com.android.support:appcompat-v7:X.X.X' // X.X.X 为最新的版本号 } 2.让你的activity继承an

修改IE浏览器滚动条样式的一个实例

浏览器 下面是一个滚动条样式的例子,通过修改各个属性值可以改变滚动条的样子. <html><head><meta http-equiv="Content-Language" content="zh-cn"><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>网页特效代码|

仿dedecms下拉分页样式修改的thinkphp分页类实例_php实例

本文实例讲述了仿dede下拉分页样式修改的thinkphp分页类.分享给大家供大家参考.具体实现方法如下: 修改thinkphp分页类:如下拉列表式分页(类似dedecms分页): 纯html代码: 复制代码 代码如下: <select name="sldd" style="width:36px" onchange="location.href=this.options[this.selectedIndex].value;"> <