[Share Experiences] Firefox“最小化/最大化/关闭”按钮的大小调整的可行性方案
Tofloor
poster avatar
thepoy
deepin
2021-01-30 18:58
Author

火狐是支持用户通过css文件对浏览器的一些部件进行修改的,具体步骤如下:

1、进入高级配置,在地址栏输入about:config,回车。
2、输入userprof搜索,找到toolkit.legacyUserProfileCustomizations.stylesheets,将后面的false改为true
3、打开Firefox用户配置文件,地址栏输入about:profiles,回车即可。
4、找到正在使用的配置文件,打开根目录(火狐的配置文件根目录名是随机的)。
5、在配置文件的根目录里新建目录chrome
6、进入chrome,新建css文件userChrome.css
7、修改userChrome.css,添加内容如下(需要自行调整):

/* 这是调整按钮大小 */
.titlebar-button > .toolbarbutton-icon {
    height: 30px !important;
    min-height: 30px !important;
    width: 15px !important;
    min-width: 30px !important;
}

/* 这是调整按扭内边距 */
.titlebar-button {
    padding-left: 6px !important;
    padding-right: 6px !important;
    padding-top: 6px !important; 
}

/* 这是修改最小化按钮样式,可换自定义图片,其他参数也可以自行调整 */
.titlebar-min{
    position: relative !important;
    list-style-image: url("red.png") !important;
    list-style-type: square !important;
    list-style-position: inherit !important;
}
/* 这是修改最大化按钮样式,参考最小化按钮 */
.titlebar-max{
}
/* 这是最大化后的恢复按钮样式,参考最小化按钮 */
.titlebar-restore{
}
/* 这是修改关闭按钮样式,参考最小化按钮 */
.titlebar-close{
}

示例文件:

.titlebar-button > .toolbarbutton-icon {
    height: 15px !important;
    min-height: 30px !important;
    width: 15px !important;
    min-width: 30px !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
    padding-top: 6px !important; 
    position: relative !important;
    list-style-type: square !important;
    list-style-position: inherit !important;
}

.titlebar-min{
    list-style-image: url("minimize-normal.svg") !important;
}

.titlebar-min:hover{
    list-style-image: url("minimize-hover.svg") !important;
}

.titlebar-max{
    list-style-image: url("maximize-normal.svg") !important;
}

.titlebar-max:hover{
    list-style-image: url("maximize-hover.svg") !important;
}

.titlebar-restore{
    list-style-image: url("maximized-normal.svg") !important;
}

.titlebar-restore:hover{
    list-style-image: url("maximized-hover.svg") !important;
}

.titlebar-close{
    list-style-image: url("close-normal.svg") !important;
}

.titlebar-close:hover{
    list-style-image: url("close-hover.svg") !important;
}

效果图片加配置文件:https://cloud.189.cn/t/V3iyaym2A7zq

修改后的效果图:

Reply Favorite View the author
All Replies
六七八九十
deepin
2021-01-31 01:06
#1

用我改的这个主题直接覆盖就行下载:https://wwe.lanzous.com/i0P3Dl0ca9c 密码:a9tu 下载覆盖系统的主题就行

 

Reply View the author
137******86
deepin
2021-01-31 20:51
#2

不起作用啊

Reply View the author
thepoy
deepin
2021-01-31 22:14
#3
137******86

不起作用啊

发一下你的用户css的路径是什么,css里的内容是什么,我看看是什么问题

Reply View the author
thepoy
deepin
2021-01-31 22:40
#4
137******86

不起作用啊

刚设置的,调整最小化按钮后的对比图:

最终效果图:

Reply View the author
thepoy
deepin
2021-02-01 01:12
#5
137******86

不起作用啊

确实漏掉了最关键的步骤,需要开启浏览器的用户style,步骤已经补上了。

Reply View the author
小小怪下士
deepin
2021-04-27 18:57
#6

请问这三个按键的彩色按钮该怎么设置呢

Reply View the author
thepoy
deepin
2021-04-28 05:04
#7
小小怪下士

请问这三个按键的彩色按钮该怎么设置呢

相关文件已经放到网盘里了,根据文章内容开启自定义功能,然后将文件放到指定的位置,重启浏览器就可以了

Reply View the author
小小怪下士
deepin
2021-04-28 17:33
#8
thepoy

相关文件已经放到网盘里了,根据文章内容开启自定义功能,然后将文件放到指定的位置,重启浏览器就可以了

感谢,

Reply View the author