css修改整个项目的滚动条样式
在项目中,滚动条不可避免的要出现。设置统一规范的滚动条也是必然。用一个独立的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修改整个项目的滚动条样式的更多相关文章
- css修改浏览器默认的滚动条样式
//滚动条样式 ::-webkit-scrollbar { width: 10px; } /* 垂直滚动条的滑动块 */ ::-webkit-scrollbar-thumb:vertical { bo ...
- css修改input表单默认样式重置与自定义大全
链接地址: 伪元素表单控件默认样式重置与自定义大全 http://www.zhangxinxu.com/wordpress/?p=3381 Chrome 现在不支持通过伪元素修改 meter 元素样式 ...
- css修改select下拉列表的默认样式
select的一些默认样式我们很难修改,比如图标的替换.接下来就说说如何修改这些默认样式: html代码: <div> <select name=""> & ...
- CSS修改input[type=range]滑块样式
input[type="range"]是html5中的input标签新属性,样子如下: <input type="range" value="4 ...
- 纯CSS修改checkbox复选框样式-02
我有用过这个纯修改input属性的 本人修改后的代码和效果图(修的不好), 这个是改动最简单的: css代码 input[type=checkbox]{ visibility: hidden; } i ...
- 纯CSS修改checkbox复选框样式
借鉴网友博客, 改用后整理收录 效果图: 移入: <!DOCTYPE html> <html> <head> <meta charset="UTF- ...
- 利用CSS 修改input=radio的默认样式(改成选择框)
html部分: <input id="item2" type="radio" name="item"> <label fo ...
- css修改,类似elememt.style样式修改
使用!important 语法优先权. .yui-b { margin-left:0px ! important; }
- 纯css修改复选框默认样式
input[type='checkbox']{ width: 20px; height: 20px; background-color: #fff; -webkit-appearance:none; ...
随机推荐
- 微信小程序个人/企业开放服务类目一览表
微信小程序个人/企业开放服务类目一览表 微信小程序个人开放服务类目表 服务类目 类目分类一 类目分类二 引导描述 出行与交通 代驾 / / 生活服务 家政.丽人.摄影/扩印.婚庆服务.环保回收/废 ...
- MySQL查询操作——2
-----------查询操作--------------------------- 查询表中的所有字段SELECT * FROM employees; 查询常量值SELECT 100;SELECT ...
- Centos7编译opencv3.4.1
Centos7编译opencv3.4.1 参考博客 https://blog.csdn.net/wjbwjbwjbwjb/article/details/79111996 1.配置epel源 yum ...
- 什么是C/S模式与B/S模式,两者区别与优缺点
转自https://wenwen.sogou.com/z/q1709598292.htm C/S (Client/Server,客户机/服务器)模式又称C/S结构,是软件系统体系结构的一种.C/S模式 ...
- synchronized各种使用场景
synchronized属于JVM锁机制 一.使用场景 在并发量比较小的情况下访问公共资源,使用synchronized是个不错的选择,但是在并发量比较高的情况下,其性能下降很严重 二.应用场景:同步 ...
- 自学java_Struts2框架
一.Struts2基础 1.Struts2是有Apache在Struts1和Webwork的基础上研发出的新一代MVC框架. 2.Struts2开发环境的搭建: 打开https://struts.ap ...
- 赋值,什么时候用value,什么时候用innerText
赋值语句: window.document.getElementById('limittime').value='${date}' window.document.getElementById('li ...
- js 实现拖拽排序
<!DOCTYPE> <html lang="zh-cn"> <head> <meta http-equiv="Content- ...
- gunicorn启动flask项目的坑
问题描述:项目用的是flask框架,在项目上线的时候,服务器上是使用gunicorn来启动项目的.但是上线之后,发现服务成功启动了,也有正确的返回值,但是没有生成日志,而用python来启动服务的时候 ...
- WebService客户端(以命令方式创建)
以命令的方式生成WebService客户端: 创建一个Project项目,客户端项目名称WS_Client,在cmd界面进入JDK的bin目录,输入以下命令 完整格式: C:\Program File ...