- Nach Image von i Photo werden in der Mediathek nur noch dunkle Felder gezeigt. (Eisenhans)
- Gefälschte iPhone 5 bereits in China zu haben
- Windows 7: HP image Zone-Hilfe aktuallisieren (horst Wurm)
- Acronis True Image: Logische OS-Partition auf Prim�re Partition kopieren? (Bauerh)
- Gefälschte iPhone 5 bereits in China zu haben
- Bing StreetSide: Seit gestern sind die Kamera-Autos unterwegs
CSS Image Sprites
CSS Image Sprites sind eine einfache Methode, um die HTTP-Aufrufe ihrer Webseite zu verringern. Hat man beispielsweise Grafiken mit einem MouseOver-Effekt von Bildern als Link, so brauchen diese meist lange Nachladezeiten mit oft unschönen Effekten. Im schlimmsten Fall erscheint sogar gar kein Bild für eine kurze Zeit.
Um das Laden dieser zweiten Bilder zu erleichtern, wird mit dem CSS-Sprites ein Bild daraus gemacht. Die beiden Grafiken werden dabei neben- oder übereinander gelegt und das zweite Bild schon vorgeladen. Beim Überfahren mit der Maus sieht der Besucher dann einen durch das CSS „verschobenen“ Bildausschnitt und es wird kein weiterer HTTP-Abruf benötigt.
CSS Sprites sind somit eine Technik im CSS der Webseite, bei der man mehrere Bilder in eine Datei speichert und immer nur den passenden Ausschnitt anzeigt. Dieser Effekt wird auch beim sogenannten Hovereffekt benötigt.
Viele Anleitung und Beispiele für den passenden CSS-Code haben wir im Grafik-Blog gesammelt.
-
http://www.amazon.de/gp/product/B005N82HDC/ref=as_li_ss_tl?ie=UTF8&tag=computerhilfen&linkCode=as2&camp=1638&creative=19454&creativeASIN=B005N82HDC
(7x gelesen) -
http://www.amazon.de/gp/product/B005N82HDC/ref=as_li_ss_tl?ie=UTF8&tag=computerhilfen&linkCode=as2&camp=1638&creative=19454&creativeASIN=B005N82HDC
(7x gelesen) - pc-einsteigerkurs-4-4 (6x gelesen)
- pc-einsteigerkurs-4-5 (5x gelesen)
- pc-einsteigerkurs-4-3 (5x gelesen)
Mehr Tipps zu CSS Image Sprites
-
Webmaster: Tabellenzeile mit CSS automatisch abwechselnd färben
Um die Hintergrundfarbe einer HTML Tabellenzeile mit einer Farbe zu versehen, hilft CSS. Für eine gute Lesbarkeit kann es aber gerade bei längeren Tabellen hilfreich...
-
Transparenter iFrame mit HTML und CSS
Transparenter iFrame - Dafür ist er praktisch: Mit einem transparenten iFrame kann man den Inhalt einer anderen Webseite in die aktuelle Seite einbetten. Ein vorhandenes...
-
CSS Transition: Warum es bei “visibility” nicht funktioniert – und was hilft!
Mit dem CSS Attribut "transition" lassen sich weiche Übergänge und auch CSS Animationen erzeugen: Durch die CSS Transition werden Zwischenwerte zwischen zwei Zuständen berechnet und...
-
Webmaster: Hintergrund-Bild per CSS platzieren und zuschneiden
Ein Hintergrundbild muss nicht zwingen ein schönes Foto sein, das tatsächlich im Hintergrund angezeigt wird: Stattdessen lässt sich mit der CSS Eigenschaft "background-image" auch ein...
-
CSS Box Sizing: Width und Height ohne Padding und Border berechnen!
Wer Webseiten mit HTML und CSS programmiert, kennt das Problem bestimmt: Wenn man die Größe eines Elements mit "width" und "height" angibt, werden die Werte...
CSS Image Sprites