在项目中,滚动条不可避免的要出现。设置统一规范的滚动条也是必然。用一个独立的css文件即可修改整个项目中的滚动条样式 。

scrollBar.css:

/* 滚动条有滑块的轨道部分 */
::-webkit-scrollbar-track-piece {
background-color: #00000000;
border-radius:;
} /* 整个滚动条 */
::-webkit-scrollbar {
width: 8px;
} /* 滚动条竖向滑块 */
::-webkit-scrollbar-thumb:vertical {
background-color: rgba(255, 255, 255, .1);
border-radius: 2px;
} /* 滚动条竖向滑块hover */
::-webkit-scrollbar-thumb:vertical:hover {
background-color: rgba(255, 255, 255, .2);
border-radius: 4px;
} /* 滚动条横向滑块 */
::-webkit-scrollbar-thumb:horizontal {
background-color: rgba(255, 255, 255, .1);
border-radius: 2px;
} /* 滚动条横向滑块hover */
::-webkit-scrollbar-thumb:horizontal:hover {
background-color: rgba(255, 255, 255, .2);
border-radius: 4px;
} /* 同时有垂直和水平滚动条时交汇的部分 */
::-webkit-scrollbar-corner {
display: block; /* 修复交汇时出现的白块 */
}

css修改整个项目的滚动条样式的更多相关文章

  1. css修改浏览器默认的滚动条样式

    //滚动条样式 ::-webkit-scrollbar { width: 10px; } /* 垂直滚动条的滑动块 */ ::-webkit-scrollbar-thumb:vertical { bo ...

  2. css修改input表单默认样式重置与自定义大全

    链接地址: 伪元素表单控件默认样式重置与自定义大全 http://www.zhangxinxu.com/wordpress/?p=3381 Chrome 现在不支持通过伪元素修改 meter 元素样式 ...

  3. css修改select下拉列表的默认样式

    select的一些默认样式我们很难修改,比如图标的替换.接下来就说说如何修改这些默认样式: html代码: <div> <select name=""> & ...

  4. CSS修改input[type=range]滑块样式

    input[type="range"]是html5中的input标签新属性,样子如下: <input type="range" value="4 ...

  5. 纯CSS修改checkbox复选框样式-02

    我有用过这个纯修改input属性的 本人修改后的代码和效果图(修的不好), 这个是改动最简单的: css代码 input[type=checkbox]{ visibility: hidden; } i ...

  6. 纯CSS修改checkbox复选框样式

    借鉴网友博客, 改用后整理收录 效果图: 移入: <!DOCTYPE html> <html> <head> <meta charset="UTF- ...

  7. 利用CSS 修改input=radio的默认样式(改成选择框)

    html部分: <input id="item2" type="radio" name="item"> <label fo ...

  8. css修改,类似elememt.style样式修改

    使用!important 语法优先权. .yui-b { margin-left:0px ! important; }

  9. 纯css修改复选框默认样式

    input[type='checkbox']{ width: 20px; height: 20px; background-color: #fff; -webkit-appearance:none; ...

随机推荐

  1. JDBCTM中Statement接口提供的execute、executeQuery和executeUpdate之间的区别

    Statement 接口提供了三种执行 SQL 语句的方法:executeQuery.executeUpdate 和 execute.使用哪一个方法由 SQL 语句所产生的内容决定. 方法execut ...

  2. maven 使用axis2 client 需要导入的依赖

    <dependency> <groupId>org.apache.axis2</groupId> <artifactId>axis2</artif ...

  3. 窗函数法设计FIR滤波器参数特征表

  4. python smtp邮件

    SMTP(Simple Mail Transfer Protocol)即简单邮件传输协议,它是一组用于由源地址到目的地址传送邮件的规则,由它来控制信件的中转方式. python的smtplib提供了一 ...

  5. Web 安全之 XSS 攻击与防御

    前言 黑客,相信大家对这一名词并不陌生,黑客们往往会利用 Web 应用程序的漏洞来攻击咱们的系统.开放式 Web 应用程序安全项目(OWASP, Open Web Application Securi ...

  6. crontab(暂存待完善)

    crontab  -e 编辑 ,(使用默认编辑器) -l  列出 第1列分钟1-59 第2列小时1-23(0表示子夜) 第3列日1-31 第4列月1-12 第5列星期0-6(0表示星期天) 第6列要运 ...

  7. Linux----------mysql基础

    目录 一.数据库介绍 1.1 数据库的优点 1.2 数据库的基本功能 1.3数据库的类型 1.4 关系型数据的组成 1.5 关系型数据库的常用组件 1.6 SQL语句 1.7 mysql命令使用 1. ...

  8. Win10无法访问网上邻居电脑共享的文件夹怎么办

    Win10无法访问网上邻居电脑共享的文件夹怎么办 现在许多电脑上装的都是Win系统,Win10无法访问网上邻居电脑共享的文件夹怎么办呢?下面小编为大家介绍下解决的方法吧! 1点击桌面上的“此电脑”图标 ...

  9. 在mysql配置文件修改sql_mode或sql-mode 怎么办?

    很多在安装程序配置数据库这一步中会出现: 请在mysql配置文件修改sql_mode或sql-mode 这个问题处理很简单: mysql中修改my.cnf,找到sql_mode,修改值为: NO_AU ...

  10. api签名认证方案

    微信签名算法 token (自己后台配置) nonce:随机数 signature:签名 echostr:返回字符串 https://mp.weixin.qq.com/wiki?t=resource/ ...