网页滚动条CSS样式
滚动条样式主要涉及到如下CSS属性:
overflow属性: 检索或设置当对象的内容超过其指定高度及宽度时如何显示内容
overflow: auto; 在需要时内容会自动添加滚动条
overflow: scroll; 总是显示滚动条
overflow-x: hidden; 禁止横向的滚动条
overflow-y: scroll; 总是显示纵向滚动条
width: 568px; width: 98%; 设置区域的宽度[像素/百分比等等]
height: 120px; 设置区域的高度[像素/百分比等等]
<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>
SCROLLBAR-FACE-COLOR: 滚动条凸出部分的颜色
SCROLLBAR-HIGHLIGHT-COLOR: 滚动条空白部分的颜色
SCROLLBAR-SHADOW-COLOR: 立体滚动条阴影的颜色
SCROLLBAR-3DLIGHT-COLOR: 滚动条亮边的颜色
SCROLLBAR-ARROW-COLOR: 上下按钮上三角箭头的颜色
SCROLLBAR-TRACK-COLOR: 滚动条的背景颜色
SCROLLBAR-DARKSHADOW-COLOR: 滚动条强阴影的颜色
SCROLLBAR-BASE-COLOR: 滚动条的基本颜色
我们一般默认的滚动条样式如下左图,右图是放大了1600倍的样
子,我们可以看到滚动条有几种言责组合的,我给他们标了7个号,
分别注释在下面的css代码的后面了,注意css的注释代码是放在
两个斜杠内的两个星号之间,如:/*这里放注释的代码*/
Body {
scrollbar-arrow-color: #f4ae21; /*三角箭头的颜色*/
scrollbar-face-color: #333; /*立体滚动条的颜色*/
scrollbar-3dlight-color: #666; /*立体滚动条亮边的颜
色*/
scrollbar-highlight-color: #666; /*滚动条空白部分的
颜色*/
scrollbar-shadow-color: #999; /*立体滚动条阴影的颜
色*/
scrollbar-darkshadow-color: #666; /*立体滚动条强阴
影的颜色*/
scrollbar-track-color: #666; /*立体滚动条背景颜色*/
scrollbar-base-color:#f8f8f8; /*滚动条的基本颜色*/
Cursor:url(mouse.cur); /*自定义个性鼠标*/
}
以上2项适用与<body>、<div>、<textarea>、<iframe>
网页滚动条CSS样式的更多相关文章
- HTML静态网页（css样式表）
CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/ 此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控 ...
- 第一节 HTML网页和CSS样式
1. 第一行 <!DOCTYPE html> 表明网页使用的是HTML5版本 2. 网页的head内容,包含了 title,meta. 3. 网页的标题 title,注意这个显示在浏览器的 ...
- 自定义滚动条CSS样式
首先,给个默认css,清除掉以前的样式,给默认背景 .scrollbar { margin-left: 30px; float: left; height: 300px; width: 65px; b ...
- 各种浏览器兼容篡位的css样式写法
谷歌浏览器的识别 @media screen and (-webkit-min-device-pixel-ratio:0) { height:10px; } IE6特制识别的 *HTML .Searc ...
- 移动端网页 rem css书写
移动端网页书写 css样式: @charset "utf-8";body,html{font-family: "微软雅黑";font-size:100px; ...
- CSS定义网页滚动条
(一)滚动条样式主要涉及到如下CSS属性: overflow属性: 检索或设置当对象的内容超过其指定高度及宽度时如何显示内容overflow: auto; 在需要时内容会自动添加滚动条overflow ...
- jQuery 自定义网页滚动条样式插件 mCustomScrollbar 的介绍和使用方法(转)
系统默认的滚动条样式,真的已经看的够恶心了.试想一下,如果在一个很有特色和创意的网页中,出现了一根系统中默认的滚动条样式,会有多么的别扭. 为了自己定义网页中的滚动条的方法,我真的已经找了很久了,就目 ...
- HTML静态网页 css样式表
CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/ 此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控 ...
- HTML&CSS基础学习笔记1.28-给网页添加一个css样式
CSS是什么? 当HTML配合CSS一起使用时,我们发现页面变得好看了很多.那么CSS到底是什么呢? CSS指层叠样式表 (Cascading Style Sheets),它主要是用于定义HTML标签 ...
随机推荐
- WebApi发布IIS404
1.确定访问路径有没有问题,路由的设置: 2.配置文件中要加 <modules runAllManagedModulesForAllRequests="true" /> ...
- 环境变量和文件查找&文件打包与解压缩
环境变量和文件查找 介绍环境变量的作用与用法 及几种搜索文件的方法 学会这些技巧可以高效地使用 Linux 知识点:环境变量的设置 环境变量的修改 环境变量 要解释环境变量,得先明白变量是什么,准确的 ...
- php条件判断（9.29 第十五天）
超级全局变量:$GLOBALS //包含全部变量的全局组合数组$_SERVER //包含请求头中的信息,用户的IP.用户的UA.头信息$_REQUEST //包含用户提交的所有数据(POST/GET ...
- HDU 5455：Fang Fang 查cff个数
Fang Fang Time Limit: 1500/1000 MS (Java/Others) Memory Limit: 65535/32768 K (Java/Others) Total ...
- python常用代码、问题汇总
1.生成dataframe数据 5.读取带 ','分隔符的txt文件 4.DataFrame格式数据处理中报错 2.安装库时出现如下错误: 3.得到股票交易日数据 1.生成dataframe数据 im ...
- C# web.config常用配置说明（文件上传大小、调试、session）
直接贴代码可好(后续用到的在更新) 黄色字体的为说明 <?xml version="1.0" encoding="utf-8"?><!-- 有 ...
- 吴裕雄--天生自然C++语言学习笔记：C++ 数据类型
使用编程语言进行编程时,需要用到各种变量来存储各种信息.变量保留的是它所存储的值的内存位置.这意味着,当创建一个变量时,就会在内存中保留一些空间. 可能需要存储各种数据类型(比如字符型.宽字符型.整型 ...
- 在Linux下 MySQL错误 ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using password: YES) 解决办法【很管用】
一般这个错误是由密码错误引起,解决的办法自然就是重置密码. 假设我们使用的是root账户. 1.重置密码的第一步就是跳过MySQL的密码认证过程,方法如下: #vim /etc/my.cnf(注:wi ...
- 新iPhone的高售价下，苹果供应商们是该笑还是该哭？
自新 iPhone发布之日起,世界就从未停止讨论其售价,越来越多的人开始困惑:新 iPhone毫无创新亮点,有什么底气卖到12799RMB呢?整个地球都在期待苹果推出廉价版 iPhone,望眼欲穿地等 ...
- zabbix监控tcp/nginx/memcache连接数自定义监控shell
#!/bin/bashtcp_status_fun(){ TCP_STAT=$1 #netstat -n | awk '/^tcp/ {++state[$NF]} END {for(key in st ...