CSS: Die Nutzung von System-Fonts

Web Fonts zu nutzen ist nett, aber manchmal ist es sinnvoll, eine Schriftart zu nutzen, die bereits auf dem System installiert ist. So kannst du die Perfomance etwas verbessern, weil der Browser so nicht mehr die Font-Datei laden muss. Außerdem kannst du dem Nutzer so einen gewohnten Look präsentieren, wenn die Schriftart auf der Webseite zu dem seinen Betriebssystems passt.

There’s also an english version of this article on my Medium site. Beitragsbild: mali maeder, Quelle: Pexels

„CSS: Die Nutzung von System-Fonts“ weiterlesen

Code Snippet: Der einfachste Weg Parallax mit JavaScript und CSS zu realisieren

Hier der JavaScript-Teil:

window.addEventListener("scroll", event => {
    document.body.style.backgroundPosition = "0px -" + (window.pageYOffset / 2) + "px";
});

Und hier wie der CSS-Teil aussehen könnte:

body {
    background-image: url(./images/bg1.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
    background-attachment: fixed; // das ist wichtig
}

 

Ein Beispiel, wie das Ergebnis aussehen kann: