如何获得深色主题的地址栏搜索结果 [英] How to get dark themed addressbar search-results

问题描述

我正在MacOS上使用Firefox开发人员版主题，以减少编程时的眼睛疲劳.

I am using the Firefox Developer Edition theme on MacOS to reduce eye strain while programming.

但是，在位置栏中输入搜索结果仍会弹出明亮的白色.

However, results while typing in the location bar still pop up bright white.

有没有人知道CSS要使这些结果使用深色背景和浅色文字?

Does anyone know of CSS to have these results use a dark background and light text?

推荐答案

通常，如果您正在寻找可以更改此设置的加载项，则主题是合适的.我使用的至少一个主题对URL Bar的自动完成结果设置了样式.如果需要，扩展也可以更改样式.但是，如果您不想使用完全不同的主题，而只是对Developer Edition主题进行了较小的修改，则可以通过将CSS放置在 userChrome.css 中，将CSS应用于配置文件的chrome来轻松实现. em>.

Generally, if you are looking for an add-on which will change this, then a theme would be appropriate. At least one of the themes I use does style the URL Bar's auto-complete results. An extension could also change the styling, if desired. However, given that you are not wanting a completely different theme, just a minor modification to the Developer Edition theme, it is easier to do this yourself by applying CSS to the profile's chrome by placing the CSS in userChrome.css.

要自己完成此操作，您需要确定要设置样式的适当元素.通常，附件 DOM Inspector 与 Element Inspector 结合使用在确定适当的样式元素.安装了这些附加组件后，打开自动完成下拉菜单并单击 Shift -右键单击可看到我们要更改的DOM:

To do it for yourself, you need to determine the appropriate elements to style. As is often the case, the add-ons DOM Inspector combined with Element Inspector are quite useful in determining the appropriate elements to style. With those add-ons installed, opening the auto-complete drop-down and Shift-Right-Click results in seeing the DOM for what we want to change:

因此，我们可以将以下内容放入配置文件的 userChrome.css 中，该文件需要位于 [配置文件目录]/chrome 目录中:

Thus, we can put the following in the profile's userChrome.css, which needs to be located in the [profile directory]/chrome directory:

/*
 * Edit this file and copy it as userChrome.css into your
 * profile-directory/chrome/
 */

/*
 * This file can be used to customize the look of Mozilla's user interface
 * You should consider using !important on rules which you want to
 * override default settings.
 */

/*
 * Do not remove the @namespace line -- it's required for correct functioning
 */
/* set default namespace to XUL */
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

#PopupAutoCompleteRichResult {
    background-color:black !important;
    -moz-border-top-colors:black !important;
    -moz-border-top-colors:black !important;
    -moz-border-left-colors:black !important;
    -moz-border-right-colors:black !important;
}

#PopupAutoCompleteRichResult .autocomplete-richlistbox {
    background-color:black !important;
}

#PopupAutoCompleteRichResult .ac-title-text,
#PopupAutoCompleteRichResult .ac-tags-text,
/*#PopupAutoCompleteRichResult .ac-url-text,*/
#PopupAutoCompleteRichResult .ac-action-text {
    color:white;
}

这会导致URL栏自动完成，并带有黑色背景和白色文本:

This results in the URL Bar auto-complete having a black background with white text:

这篇关于如何获得深色主题的地址栏搜索结果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！