為了改善您的使用體驗,本網站正在進行維護,部分功能暫時無法使用。若本站的文件無法解決您的問題,想要向社群發問的話,請到 Twitter 上的 @FirefoxSupport 或 Reddit 上的 /r/firefox 發問,我們的社群成員將很快會回覆您的疑問。

搜尋 Mozilla 技術支援網站

防止技術支援詐騙。我們絕對不會要求您撥打電話或發送簡訊,或是提供個人資訊。請用「回報濫用」功能回報可疑的行為。

了解更多

change the background color in reader mode

  • 10 回覆
  • 1 有這個問題
  • 176 次檢視
  • 最近回覆由 cor-el

more options

Okay, I have tried to make the changes in userContent.css, actually I have tried several things because most of the answers on the site assume that people making the changes are website designers or programmers. I have years of computer experience and been know to make some scripting changes, however, someone needs to really make a "For Dummies" option. That being said I tried saving the userContent.css file from the style inspector with the changes to the chrome directory and nothing I have done over the last 4 weeks of playing with this has worked.

Here is the change I am looking for, I want the dark background IN READER MODE to go from the dark grey to solid black and every page I read I have to open up the style editor and make the following change. I change the #333333 to #000000 as show below, however, I have found no way that works to making that change permanent.

Thanking you in advance for your patience and help with this issue.

*BTW,  it would be really great to just have this in the preferences area to make a change*  I am sure that I am not the only one.

body.dark {

 color: #eeeeee;
 background-color: #000000;

}

Okay, I have tried to make the changes in userContent.css, actually I have tried several things because most of the answers on the site assume that people making the changes are website designers or programmers. I have years of computer experience and been know to make some scripting changes, however, someone needs to really make a "For Dummies" option. That being said I tried saving the userContent.css file from the style inspector with the changes to the chrome directory and nothing I have done over the last 4 weeks of playing with this has worked. Here is the change I am looking for, I want the dark background IN READER MODE to go from the dark grey to solid black and every page I read I have to open up the style editor and make the following change. I change the #333333 to #000000 as show below, however, I have found no way that works to making that change permanent. Thanking you in advance for your patience and help with this issue. *BTW, it would be really great to just have this in the preferences area to make a change* I am sure that I am not the only one. body.dark { color: #eeeeee; background-color: #000000; }

由 BigData88 於 修改

被選擇的解決方法

That pref shouldn't have effect in Firefox 68.

A much more likely cause on Mac is that you save the file with RTF formatting code and not as a plain text file, so check that.

從原來的回覆中察看解決方案 👍 1

所有回覆 (10)

more options

You need to add the !important flag if you want to override existing rules.

@-moz-document url-prefix(about:reader){ body.dark { color: #eeeeee !important; background-color: #000000 !important; } } See also the default style sheet:

  • chrome://global/skin/aboutReader.css
more options

Please see the attached picture of the userContent.css file and this did not solve the problem.

Thank you very much for your reply, I am sure that we are close to making this work.

由 BigData88 於 修改

more options

Hi BigData88, if you haven't already, could you turn on viewing of userContent.css in the developer tools?

To open the developer tools panel, you can right-click (or Ctrl+click) the background of the reader view page, then click Inspect Element. This should open the Inspector.

On the top bar of the developer tools you should find a ••• menu button and if you click that, Settings.

On the Settings panel, Inspector section, check the box for Show Browser Styles.

Now when you are looking at rules in the Inspector, you should see the ones from userContent.css. Does Firefox show that section and, if so, are the rules supposed to be active (not lined out)? (Example screenshot attached)

more options

It looks like my usercontent.css is not being loaded, see the attached screen capture of the file location and then the screen capture of the inspector

Thanking you for your support

more options

The relevant sections in the Inspector are probably not adjacent, so you may want to scroll down to the end of the list to confirm that userContent.css isn't being read.

If the profile folder pictured in the second screenshot is your currently active profile, then the file appears to be in the correct location. If you click up a level you can easily confirm it's the active profile because files like places.sqlite (history + bookmarks database) will have a recent timestamp.

Just in case no one mentioned it before, Firefox only reads the userContent.css file at startup, so you need to completely Quit out of Firefox between edits in order to see the effects, it's not enough to reload the page.

more options

I did check the entire area and no listing. I also confirmed that is the active profile based upon your suggestions for checking.

So it appears that the file is not being loaded.

I am completely quitting out of Firefox every time. I have read this in several of the posts that I have tried over the last month. But it is still good to ask, I have done computer support for over 30 years and I have learned to never assume ANYTHING.

more options

There is a change rolling out in Firefox 69 that might be taking effect prematurely. Could you check this:

(1) In a new tab, type or paste about:config in the address bar and press Enter/Return. Click the button promising to be careful or accepting the risk.

(2) In the search box above the list, type or paste userpro and pause while the list is filtered

(3) Double-click the toolkit.legacyUserProfileCustomizations.stylesheets preference to switch the value from false to true

If that was false and you changed it to true, you'll need to restart Firefox one more time.

more options

選擇的解決方法

That pref shouldn't have effect in Firefox 68.

A much more likely cause on Mac is that you save the file with RTF formatting code and not as a plain text file, so check that.

more options

Thank you both, I already had toolkit.legacyUserProfileCustomizations.stylesheets set to true

when I saved it as a pain text file it worked. WOW

As a side note and a different support issue, when I am in reader mode the menu at the top of the screen no longer autohides as I start to scroll down. but I am sure this is a different issue. and Yes, I do have the preferences set to autohide in reader mode wherever they are, I had found that a couple of version ago.

more options

Note that the Reader toolbar comes with a menu (second button) to select three possible CSS style sheets: Light, Dark, Sepia