CSS Tutorial und HTML Beispiele

CSS (Cascading Style Sheets) Basics Tutorial. Dazu Beispiele mit HTML in Verbindung mit CSS.

CSS background-size

Dank der neuen CSS3 Funktion background-size, ist es nun ganz einfach möglich das Hintergrundbild einer Webseite, immer hundertprozentig auf die volle Bildschirmgröße des Anzeigegerätes hin automatisch anpassen zu lassen.

html {
    background-image: url(css3-background-image.jpg);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-color: #000;
}

Mit diesem CSS3 Snippet bekommt der Besucher einer Webseite, ein perfekt skaliertes Hintergrundbild zu sehen, das sich der Bildschirmauflösung anpaßt. Auch bei einer Veränderung der Fenstergröße, bleibt das CSS Hintergrundbild immer prachtvoll anzuschauen.