谷歌滚动条样式(滚动条样式按钮)

有不少可以帮你修改Chrome默认滚动条样式的扩展,ScrollBarX就是其中的佼佼者,但是这个扩展在安装的时候提示说会存取所有的网站数据,这就让人感觉很难以接受了。其实咱们可以自己动手,丰衣足食。首先在自己的系统里找到如下这个.css文件:Windows:%LOCALAPPDATA%\Google\Chrome\UserData\Default\UserStyleSheets\…

大家好,又见面了,我是你们的朋友全栈君。

谷歌滚动条样式(滚动条样式按钮)

有不少可以帮你修改Chrome默认滚动条样式的扩展,Scroll Bar X就是其中的佼佼者,但是这个扩展在安装的时候提示说会存取所有的网站数据,这就让人感觉很难以接受了。其实咱们可以自己动手,丰衣足食。首先在自己的系统里找到如下这个.css文件:

Windows:
%LOCALAPPDATA%\Google\Chrome\User Data\Default\User StyleSheets\Custom.css

Mac:
/Users/YourUsername/Library/Application Support/Google/Chrome/Default/User StyleSheets/Custom.css

Ubuntu:
~/.config/chromium/Default/User\ StyleSheets/Custom.css

用任何一款文字编辑器打开之,加入以下代码:

::-webkit-scrollbar-track-piece{
	background-color:#fff;
	-webkit-border-radius:0;
}
::-webkit-scrollbar{
	width:8px;
	height:8px;
}
::-webkit-scrollbar-thumb{
	height:50px;
	background-color:#999;
	-webkit-border-radius:4px;
	outline:2px solid #fff;
	outline-offset:-2px;
	border: 2px solid #fff;
}
::-webkit-scrollbar-thumb:hover{
	height:50px;
	background-color:#9f9f9f;
	-webkit-border-radius:4px;
}

保存之后重新打开你的Chrome浏览器,看到变化了吧?其实这些都是基础的CSS代码,所以你可以随心所欲的定制。比如你觉得滚动条太细了,即可编辑以下这段代码里的宽度:

::-webkit-scrollbar{
	width:16px;
}

另外,其实Chrome的Web Inspector也是可以通过修改CSS来定制页面风格的,其CSS文件地址:

Windows:
%LOCALAPPDATA%\Google\Chrome\User Data\Default\User StyleSheets\Custom.css

Mac:
/Users/YourUsername/Library/Application Support/Google/Chrome/Default/User StyleSheets/Custom.css

Ubuntu:
~/.config/chromium/Default/User\ StyleSheets/Custom.css

Via GTricks

转载自:谷奥

转载于:https://www.cnblogs.com/cmleung/archive/2011/09/01/2161545.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/126888.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 理解Object.defineProperty方法

    理解Object.defineProperty方法nbsp nbsp 之前没怎么对 Object defineProper 方法做深入了解 就知道可以通过这个方法可以设置对象的属性 现在稍微了解以后 发现还是有不少东西值得记录一下的 所以写下这篇博客 一 语法 Object defineProper obj prop descriptor nbsp nbsp nbsp nbsp obj 需要定义属性的对象 nbsp nbsp prop 需要定义的属性 nbsp nbsp descriptor 属性的描述描述符 nbsp

    2026年2月5日
    0
  • 好看的热血动漫番剧_评价高好看的动漫

    好看的热血动漫番剧_评价高好看的动漫大家好,我是辣条。最近被室友安利热血动漫番《终末的女武神》和《拳愿阿修罗》,太上头了周末休息熬夜看完了。不过资源不太好找,辣条一怒爬取了资源,这下可以看个够了。室友崇拜连连,想起了我的班花,快点开学,阿西吧…Python爬虫-vip动漫采集效果展示爬取目标网站目标:樱花动漫工具使用开发工具:pycharm开发环境:python3.7,Windows10使用工具包:requests,lxml,re,tqdm重点学习内容正则的使用tqdm的.

    2022年8月23日
    6
  • 如何下载mysql驱动jar包

    如何下载mysql驱动jar包mysql的驱动jar包下载教程

    2022年5月11日
    40
  • RS485接口定义

    RS485接口定义

    1.英式标识为 TDA(-) 、TDB(+) 、RDA(-) 、RDB(+) 、GND 
    2.美式标识为 Y 、Z 、 A 、 B 、 GND  
    3.中式标识为 TXD(+)/A 、TXD(-)/B 、RXD(-) 、RXD(+)、GND  
       rs485两线一般定义为:  
                 “A, B”或”Date+,Date-”  
       即常说的:”485+,485-”  
       rs485四线一般定

    2022年5月27日
    73
  • html鼠标样式怎么去掉,CSS鼠标样式cursor属性怎么设置

    html鼠标样式怎么去掉,CSS鼠标样式cursor属性怎么设置CSS鼠标样式可以通过设置cursorg属性,从而达到鼠标在对象上移动的鼠标样式。一般在网页中一些特殊版块布局时,会遇到这类需求,比如鼠标经过指针变为手指形状等样式,接下来我们介绍鼠标指针样式cursor控制。系统默认鼠标指针样式外,还可以通过CSS设置图片等元素为鼠标指针样式,比如有些网站鼠标指针是各种各样小图片样式,当然这个是通过csscursor设置鼠标样式。CSS鼠标样式cursor语法…

    2022年5月29日
    47
  • 线性代数————思维导图(上岸必备)(行列式部分)

    该思维导图为线性代数行列式的大纲以及基本解题思路,内容较为详细。该思维导图为本人依照张宇闭关修炼2020所制作,希望能帮助大家顺利上岸

    2022年4月9日
    224

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号