Ein Hintergrund für Firefox New Tab

von 3 Kommentare

Nach längerer Zeit mal wieder ein CSS-Schnipsel für die userContent.css von Firefox. Eigentlich dachte ich wir hätten, was Anpassungen angeht, hier schon alles gehabt. Das stimmt aber nicht. Es gibt noch immer neue und klasse Tweaks.

Nachfolgender Code für die userContent.css bindet ein Bild auf der Seite „New Tab“ ein. Das Ergebnis könnt ihr auf dem Titelfoto bewundern. Damit erhält Firefox ein Feature, dass bei anderen Browsern schon längere Zeit üblich ist. Die benötigen Bilder könnt ihr bei Unsplash oder Pixabay herunterladen. Obiges Bild findet ihr bei Pixabay.

/*
 * new-tab-background
 * nach einem Reddit Thread
 * https://www.reddit.com/r/FirefoxCSS/comments/d5suwl/a_small_tweak_i_made_for_changing_the_background/
 * https://github.com/OliveOil1/New-Tab-Background
 */
 
:root{
  /*---??customizations??---*/
  --backgroundImageUrl: url("man-1915351-pixabay.jpg")
}

/*---Add background image to about:home and about:newtab---*/
@-moz-document url(about:home), url(about:newtab){
  body {
    background-image: var(--backgroundImageUrl) !important;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    left: 0;
    margin: 0;
    padding: 0;
    position: fixed;
    top: 0;
    transition: opacity 700ms;
    width: 100%;   
  }
}

Die Zeile --backgroundImageUrl: url("man-1915351-pixabay.jpg") nimmt den Namen des Bildes auf. Das Bild muss in meinem Beispiel im Ordner chrome gespeichert werden.

Schlagwörter