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

有不少可以帮你修改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)
上一篇 2022年4月17日 下午12:20
下一篇 2022年4月17日 下午12:20


相关推荐

  • 补码乘法、booth算法、Wallace树

    补码乘法、booth算法、Wallace树补码乘法 booth 算法 Wallace 树补码乘法原理 booth 算法 booth 一位一乘算法 booth 两位一乘算法 Wallace 树补码乘法原理大家都来学习 booth 算法了 那么补码的加法一定了解了 即 X 补 Y 补 X Y 补 X 补 Y 补 X Y 补 X 补 Y 补 X Y 补 那么乘法同样的 我们也想用补码来表示 但是 X 补 Y 补 X Y 补 X 补 Y 补 neq X Y 补 X 补 Y 补 X Y 补 现在我们需要知道补码的定义 对于 n

    2025年6月7日
    4
  • IDEA和eclipse的区别

    IDEA和eclipse的区别1 IDEA 能打开多个工作空间 而 eclipse 一次只能打开一个工作空间 2 IDEA 是一个没有 ctrl s 的 IDE 无需担心保存或代码丢失 可查看代码编写历史 3 idea 使用的是内存空间 会将建立的索引都保存到内存中 而实际占用的 cpu 少 4 eclipse 使用的内存空间相对较少 但占用的 cpu 多 这就导致 eclipse 比较卡的原因

    2026年3月27日
    2
  • Google EventBus 使用详解

    Google EventBus 使用详解EventBus是Google.Guava提供的消息发布-订阅类库,它实现了观察者设计模式,消息通知负责人通过EventBus去注册/注销观察者,最后由消息通知负责人给观察者发布消息。首先使用 maven 依赖:<!– https://mvnrepository.com/artifact/com.google.guava/guava –> <dependenc…

    2022年6月17日
    124
  • Hello-Agents 第十章 智能体通信协议

    Hello-Agents 第十章 智能体通信协议

    2026年3月15日
    2
  • php用正则表达式匹配URL的简单方法(亲测可行)

    php用正则表达式匹配URL的简单方法(亲测可行)

    2021年10月30日
    219
  • matlab仿真的图片怎么保存_matlab如何导出

    matlab仿真的图片怎么保存_matlab如何导出一种是出来图形窗口后手动保存(这儿又可以分两种):1直接从菜单保存,有fig,eps,jpeg,gif,png,bmp等格式。2edit——〉copyfigure,再粘贴到其他程序。另一种是用命令直接保存(这里也有两种):1用saveas命令保存图片。saveas的三个参数:(1)图形句柄,如果图形窗口标题栏是“Figure3”,则句柄就是3.(2)文件名。(3)单引号字符串,指…

    2025年11月6日
    4

发表回复

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

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