浏览器起始页面背景

[百草谷居士]

我一般喜欢那种带“快速拨号”界面的浏览器起始页，就是将几个常用的网址放在起始页

比如，火狐、edge、vivaldi、brave，都支持这种形式。

但是我又希望，这个起始页的背景图片能够每天自动更换。不是在选定的几个图片中自动更换，而是从网络上拉取，比如 bing 每日图片那样，每天一个新图片。

这个该如何实现呢？

[yq-ysy]

《Firefox(火狐)浏览器自定义主页背景图片，自定义空白页》
https://blog.csdn.net/Inori_333/article ... /135365128

本文实现：Firefox(火狐)浏览器自定义主页背景图片，Firefox(火狐)浏览器自定义空白页，Firefox(火狐)浏览器隐藏搜索栏等等。

写在前面：Firefox主页和新增的空白页太丑了，想自定义美美的背景图片，然后优化主页显示。于是在网上找了找资料又自己改了改，最终实现了很好的效果。
步骤一：

在地址栏进输入about:profiles 回车访问。

打开default-release的根目录文件夹，新建一个名为chrome的文件夹。

如图。

步骤二：

将你想要设置的背景图片存入新建的这个chrome文件夹，并在文件夹中新建一个txt文件，重命名为userContent.css（这个文件可以对浏览器样式进行设置）。

之后打开userContent.css（打开方式用记事本就行），修改其内容为如下代码：

这段代码具体的作用是这样的：

第一段是设置home页面（主页）、blank页面（空白页）、newtab页面（新建标签页）、privatebrowser页面（隐私模式标签页）。.top-site-button .title： 这个选择器用于匹配 Firefox 浏览器主页上的顶部站点快捷方式的标题文本。.context-menu-button： 这个选择器用于匹配 Firefox 浏览器中点击页面时出现的上下文菜单（Context Menu）中的按钮。通过样式表将字体改为了白色。

第二段将logo移除了；

第三段将搜索栏移除了（毕竟现在的火狐浏览器可以直接在地址栏搜索），如果想保留搜索栏，可以不添加下面这段内容。

第四段修改了鼠标聚焦时推荐网页的选中颜色为半透明。如果你把推荐网页之类的关闭了的话也可以不添加。

第五段是在设置背景图片。

[yq-ysy]

《How do I change the background image of Home page in Firefox?》
https://superuser.com/questions/1495946 ... in-firefox

In Firefox, there's no way to change the background image of the home page (new tab) from the Settings. Add-ons can surely do that, but there's a better approach: We can create a CSS file and tell Firefox to load that file when it starts.

To do so, follow these steps:

Go to about:support in the address bar. View the section "Application Basics" ➔ Profile Directory (or "Profile Folder" on MacOS) ➔ click the button "Open Directory" (or "Show in Finder" on MacOS): Firefox about:support screenshot options

It should open your Firefox profile directory, which is usually in your $HOME directory.

Create a directory called chrome inside the opened directory, if it's not already there.

Go to the chrome directory and (a) create a directory called img and (b) create a file called userContent.css. Move your image to the img directory.

Open userContent.css in any text editor and paste the following code:

代码： 全选

@-moz-document url(about:home), url(about:newtab), url(about:privatebrowsing) {
    .click-target-container *, .top-sites-list * {
        color: #fff !important ;
        text-shadow: 2px 2px 2px #222 !important ;
    }

    body::before {
        content: "" ;
        z-index: -1 ;
        position: fixed ;
        top: 0 ;
        left: 0 ;
        background: #f9a no-repeat url(img/cherry-blossom-1260646.jpg) center ;
        background-size: cover ;
        width: 100vw ;
        height: 100vh ;
    }
}

Don't forget to change the file name in url(img/cherry-blossom-1260646.jpg) to your preferred image.

Save the file and quit the editor.

Go to the url about:config, accept the risk (we will not really do anything harmful here, nothing to worry about), and in the Search Bar, paste toolkit.legacyUserProfileCustomizations.stylesheets, and set the value to true. This tells Firefox to load the CSS file at startup.

Restart Firefox if it's running.

Explanation to the CSS code

A

代码： 全选

@-moz-document url(about:home), url(about:newtab), url(about:privatebrowsing)

Enables the background on Home Tabs, New Tabs, and in Private Browsing tabs.

B

代码： 全选

.click-target-container *, .top-sites-list * {
    color: #fff !important ;
    text-shadow: 2px 2px 2px #222 !important ;
}

Changes the "Top Sites" and "Highlights" colours to white with a dark text-shadow. For lighter wallpaper, you need to edit the colours to make it look more comfortable to you.

C

代码： 全选

body::before {
    content: "" ;
    z-index: -1 ;
    position: fixed ;
    top: 0 ;
    left: 0 ;
    background: #f9a no-repeat url(img/cherry-blossom-1260646.jpg) center ;
    background-size: cover ;
    width: 100vw ;
    height: 100vh ;
}

loads the image (here, img/cherry-blossom-1260646.jpg) to body::before which has a fixed position and the width and height of the viewport. If the background image is loading or not found, the background colour is set to #f9a.

The background-size: cover makes it auto adjustable with Firefox and zoom in/out doesn't affect the image size.

On GNU/Linux and Unix systems, you can load images from the /usr/share/backgrounds/ as well.

After a restart Firefox should look something like this:

[百草谷居士]

找了一个名叫 “Howdz起始页” 的插件，可以定制起始页

https://doc.howdz.xyz/