Ratgeber: "HTML, CSS, Javascript & PHP"

3D-Effekt für Verknüpfungen mit CSS

Wer den Verknüpfungen auf seiner Website einen unvergesslichen und doch dezenten Effekt verleihen möchte, hat es inzwischen nicht mehr gerade einfach. Wir zeigen Ihnen wie Sie einfach einen eindruckvollen 3D-Effekt zu Ihren Links hinzufügen.

3D-Effekt für Verknüpfungen mit CSS

© Archiv

3D-Effekt für Verknüpfungen mit CSS

Es scheint, als sei das letzte Wort in Sachen spannender :hover-Effekte längst gesprochen und es ließe sich niemand mehr mit dezent einladenden Verknüpfungen hinter den Ofen hervorlocken.Wer dennoch beim Website-Besucher originelle Eindrücke hinterlassen möchten, kann die :hover-Interaktivität in die dritte Dimension bringen.Der Einsatz von Flash ist hierzu keine Voraussetzung. Beim Markup brauchen Sie keine gesonderten Vorkehrungen zu treffen;es dreht sich alles um eine ganz gewöhnliche Syntax einer rein traditionellen Verknüpfung:

<a href="http://www.magnus.de/">Internet Magazin</a>

Dass benötigte CSS beinhaltet:

body {
font-family: sans-serif;
background: #333;
color: #eee;
}
a {
text-decoration: none;
color: hsl(206, 80%, 50%);
}
.roll {
display: inline-block;
overflow: hidden;
vertical-align: top;
-webkit-perspective: 400px;
-moz-perspective: 400px;
-webkit-perspective-origin: 50% 50%;
-moz-perspective-origin: 50% 50%;
}
.roll span {
display: block;
position: relative;

Mehr zum Thema

Whatsapp auf PC
Mit oder ohne Download

Mit Whatsapp Web oder der Whatsapp Desktop-App nutzen Sie den Messenger bequem am PC. Wir erklären Download, Installation und Einrichtung.
Whatsapp Alternativen
Für Android, iPhone, iPad & Co.

Es gibt keine Whatsapp-Alternative? Quatsch! Diese 10 Messenger-Apps für Android, iOS und Windows Phone sind der perfekte Ersatz.
Kalender synchronisiert auf iPad
Zeit-Management

Kalender auf dem Smartphone, PC und im Web synchronisieren - mit unseren 9 Tipps schaffen Sie genau das. Verpassen Sie keinen Termin mehr!
Cloud-Speicher
Meta-Cloud

Diese Meta-Dienste und Cloud-Tools fassen kostenlosen Cloud-Speicher von Google, Dropbox und Co. zusammen - oft besser als das Original.
Dropbox, Google Drive & Co.: Steckdose mit Logos
Verschlüsselung, Explorer-Zugriff & Co.

Wir haben Tipps für Add-ons und Apps für Google Drive und Dropbox. Damit kommen Verschlüsselung, Zugriff im Windows-Explorer und mehr.