Question

我正在使用带有深色主题的Linux Mint 18.3。因此，（对于linux系统）默认的文本颜色为浅灰色，背景为深灰色。

Firefox将这些颜色用于文本输入/表格（浅灰色）和复选框（深灰色）。

但是，铬具有自己的标准颜色。这就是我想要的Firefox。

我知道您可以在userContent.css中设置自定义css设置，但这会覆盖所有输入表单，而不仅仅是网站本身未设置样式的输入表单。< / p>

是否有办法使Firefox也将其他默认颜色（如Chromium）用于没有其他样式的元素？

Answer 1

我使用薄荷糖，但我遇到了完全相同的问题。这对我有用：

转到~/.mozilla/firefox/randomName.default。创建一个名为chrome的新文件夹（如果已经存在chrome文件夹，请将其重命名为old-chrome）。在chrome文件夹中，创建一个名为 userContent.css 的新文件，并粘贴以下代码。

@-moz-document url-prefix(about:blank) {*{background-color:#202020;}}
/*
* Use this css file to eliminate problems in Firefox
* when using dark themes that create dark on dark
* input boxes, selection menus and buttons. Put this
* in the ../firefox/default/chrome folder or your
* individual user firefox profile chrome folder.
*/
input {
border: 2px inset white;
background-color: white;
color: black;
-moz-appearance: none !important;
}
textarea {
border: 2px inset white;
background-color: white;
color: black;
-moz-appearance: none !important;
}
select {
border: 2px inset white;
background-color: white;
color: black;
-moz-appearance: none !important;
}
input[type="radio"],
input[type="checkbox"] {
border: 2px inset white !important;
background-color: white !important;
color: ThreeDFace !important;
-moz-appearance: none !important;
}
*|*::-moz-radio {
background-color: white;
-moz-appearance: none !important;
}
button,
input[type="reset"],
input[type="button"],
input[type="submit"] {
border: 2px outset white;
background-color: #eeeeee;
color: black;
-moz-appearance: none !important;
}
body {
background-color: white;
color: black;
display: block;
margin: 8px;
-moz-appearance: none !important;
}

保存文件并重新启动Firefox。您的问题应该得到解决。祝好运。如果需要将其改回，只需删除chrome文件夹，然后重新启动Firefox。

Answer 2

@VishnuVS的答案确实是我到目前为止测试过的唯一实用/可行的解决方案。我添加了一些样式（来源：https://www.inserthtml.com/2012/06/custom-form-radio-checkbox/），作为复选框和单选按钮无法正常工作（对我来说）。

@-moz-document url-prefix(about:blank) {*{background-color:#202020;}}
/*
* Use this css file to eliminate problems in Firefox
* when using dark themes that create dark on dark
* input boxes, selection menus and buttons. Put this
* in the ../firefox/default/chrome folder or your
* individual user firefox profile chrome folder.
*/
input {
border: 2px inset white;
background-color: white;
color: black;
-moz-appearance: none !important;
}
textarea {
border: 2px inset white;
background-color: white;
color: black;
-moz-appearance: none !important;
}
select {
border: 2px inset white;
background-color: white;
color: black;
-moz-appearance: none !important;
}
input[type="radio"],
input[type="checkbox"] {
border: 2px inset white !important;
background-color: white !important;
color: ThreeDFace !important;
-moz-appearance: none !important;
}
*|*::-moz-radio {
background-color: white;
-moz-appearance: none !important;
}
button,
input[type="reset"],
input[type="button"],
input[type="submit"] {
border: 2px outset white;
background-color: #eeeeee;
color: black;
-moz-appearance: none !important;
}
body {
background-color: white;
color: black;
display: block;
margin: 8px;
-moz-appearance: none !important;
}
input[type="checkbox"],input[type="radio"] {
appearance:none;
}
input[type="checkbox"] {
-webkit-appearance: none;
background-color: #fafafa;
border: 1px solid #cacece;
box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
padding: 9px;
border-radius: 3px;
display: inline-block;
position: relative;
}
input[type="checkbox"]:active, input[type="checkbox"]:checked:active {
box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}
input[type="checkbox"]:checked {
background-color: #e9ecee;
border: 1px solid #adb8c0;
box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1);
color: #99a1a7;
}
input[type="checkbox"]:checked:after {
content: '\2714';
font-size: 14px;
position: absolute;
top: 0px;
left: 3px;
color: #99a1a7;
}
input[type="radio"] {
-webkit-appearance: none;
background-color: #fafafa;
border: 1px solid #cacece;
box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
padding: 9px;
border-radius: 50px;
display: inline-block;
position: relative;
}
input[type="radio"]:checked:after {
content: ' ';
width: 12px;
height: 12px;
border-radius: 50px;
position: absolute;
top: 3px;
background: #99a1a7;
box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3);
text-shadow: 0px;
left: 3px;
font-size: 32px;
}
input[type="radio"]:checked {
background-color: #e9ecee;
color: #99a1a7;
border: 1px solid #adb8c0;
box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1), inset 0px 0px 10px rgba(0,0,0,0.1);
}
input[type="radio"]:active, input[type="radio"]:checked:active {
box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}

Answer 3

您可以在Firefox中选择所需的任何颜色： 3-bar menu (or 'Tools') > Add-ons > Themes。

或者您可以在系统设置中更改系统颜色。

如果这样做没有帮助，请阅读Firefox support answer：

更改字体颜色

要更改字体颜色，请执行以下操作：


单击菜单按钮，然后选择选项 > 首选项。

选择Content General面板。

在字体和颜色下，单击颜色... 按钮。

单击任何彩色矩形将为您显示可能的颜色。选择所需的颜色   单击彩色矩形之一。

单击确定以关闭“颜色”窗口。

关闭 about:preferences 页面。您所做的任何更改都会自动保存。


自定义字体颜色

某些网站具有自定义字体颜色，以禁用它们：


单击菜单按钮，然后选择选项 > 首选项。

选择ContentGeneral面板。

在字体和颜色下，单击颜色... 按钮。

在打开的窗口中，将用上面的选择覆盖由页面指定的颜色设置为Always。

单击确定以关闭“颜色”窗口。

关闭 about:preferences 页面。您所做的任何更改都会自动保存。


其他颜色设置

文本和背景：您可以在此处更改默认文本和背景颜色，以在未指定默认颜色的网页上使用   信息。单击颜色样本以选择颜色。


使用系统颜色：：选中此选项首选项以使用操作系统设置中定义的颜色代替颜色   上面指定。


链接颜色：：您可以在此处更改Web链接的默认颜色。单击颜色样本以选择颜色。


下划线链接：：默认情况下，链接在网页上带有下划线。取消选中此选项首选项以禁用此选项。请注意，许多网站   指定自己的样式规则，并且此optionpreference没有   对这些网站的影响。


使用上面的选择替换页面指定的颜色：


始终：选择此选项首选项可强制所有网站使用您的默认颜色。

仅具有高对比度主题：：此选项首选项将使Firefox使用网页作者指定的颜色，但   当您使用高对比度WindowsLinux主题时。

从不：：选择此选项首选项可使Firefox使用网页作者指定的颜色。





注意：：如果以后要恢复默认颜色：



在地址栏中，键入about:config，然后按 Enter Return 。


about:config “这可能会使保修无效！” 警告页面。点击I'll be careful, I promise!I accept the risk!     继续进入about:config页。




在“搜索”字段中输入browser*color。


右键单击，按住 Ctrl 键，同时单击修改的用户设置首选项。

选择Reset。

Answer 4

一种更简单的方法（也将产生更美观的结果）是要求Firefox使用GTK方案的简化版来呈现表单输入。

为此，请导航至about:config，并通过单击“我接受风险！”来保证要小心。然后创建一个新的字符串参数widget.content.gtk-theme-override。使用您喜欢的“浅色”主题的名称作为值（在我的情况下为Yaru）。此配置更改将在下次重启Firefox后生效。

问题解决了！

Firefox-输入/表单的默认配色方案？

4 个答案:

更改字体颜色

自定义字体颜色

其他颜色设置