Schlagwörterarchiv: CSS3

6 interessante und tolle HTML5- und CSS3-Cheat-Sheets

HTML, HTML5, CSS und CSS3 kurz und bündig

HTML-Mega-Cheat-Sheet-tile

Ich möchte Ihnen heute eine kleine, aber feine Sammlung von 6 Cheat Sheets zu den Web-Themen HTML, HTML5, CSS und CSS3 zum kostenlosen Download anbieten.

Was sind eigentlich Cheat Sheets?

Cheat Sheets sind „Spickzettel“ im Miniaturformat und dienen den Webdesignern und Programmierern als wichtige und praktische Hilfsmittel und Nachschlagewerke. Sie bieten einen raschen Zugriff auf Befehle und Funktionen und sind kurze und wichtige Zusammenfassungen zu einem Thema in kompakter Form.

Weiterlesen

42 fantastische und kostenlose HTML5+CSS3 Templates

40+ kostenlose HTML5- und CSS3-Webseitenvorlagen von HTML5 UP

snipaste20161208_092928

Auf der Webseite von HTML5 UP gibt es eine große und tolle Sammlung von 42 kostenlosen HTML5- und CSS3-Templates, welche Sie ohne Beschränkungen kostenlos downloaden können.

Alle gratis angebotenen Webseiten-Vorlagen sind voll responsive (siehe Demovideo) und unterliegen der weiter unten angeführten Lizenz.

Demovideo

In meinem kurzen Clip sehen Sie die Funktionsweise der Templates. Schalten Sie zwischen Desktop, Tablet, Tablet (Portrait) und Mobile (Smartphone) hin und her und sehen Sie, wie sich die Webseite an die jeweilige Größe anpasst.

Weiterlesen

CSS3-Tricks: 3D-Flip Hover Animation für Serviceboxen

CSS3-Tricks: Coole 3D-Animationen mit Hover-Effekt erstellen

the-cube-service-box

Auf der Webseite von Code My UI habe ich eine interessante Anleitung zur Erstellung von CSS3-Animationen mit tollen Hover-Effekten gefunden.

Die 3D-Flip-Animation können Sie sehr gut auf einem Privat-Portfolio oder auf einer Service-Webseite verwenden, wo Sie mit mehreren Boxen verschiedene Dienstleistungen anbieten können.

Wenn Sie mit der Maus über die 4 verschiedenfarbigen Boxen fahren, rotieren diese mit einem 3D-Flip und zeigen – die zuerst versteckten – zusätzlichen Infos zu Ihren angebotenen Diensten. Entworfen hat das coole Projekt Rahul Dhiman, auf CodePen.io können Sie sein Projekt live bearbeiten und die Hover-Effekte je nach Lust und Laune bearbeiten.

Weiterlesen

3 interessante und coole CSS3 Image Hover-Effekte

3 cool and beautiful CSS3 image hover effects

screenshot-3-hover-effects

Auf den modernen Webseiten gibt es zahlreiche Techniken, die verwendet werden können, um interessante Interaktionen zu schaffen. Die einfachsten und elegantesten wurden in der Regel mit CSS realisiert – und insbesondere durch die Ergänzungen, welche mit CSS3 aufkamen.

In den „alten Tagen des Internets“ mussten die Webdesigner (und solche, die sich dafür hielten) JavaScript anwenden, um bestimmte Effekte oder Wirkungen zu erzielen. Dank der ständig wachsenden Unterstützung für CSS3 in allen Browsern ist es nun möglich, die 3 von mir unten weiter angeführten Hover-Effekte recht einfach und rasch einzurichten.

Weiterlesen