Bild mit Hover-Text erstellen

Manchmal kann es sinnvoll sein, ein Bild bspw. mit einem Hover-Text zu versehen. So kann man bspw. den Namen des Autors über seinem Profilbild schweben lassen. Auch in einer Galerie ist dabei ein solcher Effekt zumeist sehr nett anzusehen. Mit CSS ist dabei sehr einfach möglich, ein Bild mit Hover-Text zu erstellen.

Weiterlesen …Bild mit Hover-Text erstellen

Hyperlinks mit linearem Farbverlauf

Du suchst nach weiteren, individuellen Gestaltungsmöglichkeiten für deine Website? Dabei kannst du bspw. Hyperlinks mit linearem Farbverlauf erstellen. Einen solchen Effekt sieht man nicht häufig und könnte – je nach Design deiner Website – für einen netten Zusatzeffekt sorgen.

In diesem Artikel zeige ich dir dabei, wie du deine Hyperlinks mit einem linearen Farbverlauf hinterlegen kannst.

Weiterlesen …Hyperlinks mit linearem Farbverlauf

URL hinter einen Link drucken

Hast du schon mal einen Artikel einer Website ausgedruckt? Du hast dabei sicher festgestellt, dass die URL zu einem Link natürlich fehlt. Doch das lässt sich mit einem kleinen CSS Snippet ändern. Mit einer CSS Formatierung kannst du dabei die URL hinter einen Link drucken. Natürlich nur dann, wenn die Website auch tatsächlich ausgedruckt wird.

Wie du eine URL hinter einen Link drucken kannst, zeige ich dir in diesem Artikel.

Weiterlesen …URL hinter einen Link drucken

Animierter Fortschrittsbalken mit CSS

Es gibt durchaus Situationen bei denen es sinnvoll ist, den aktuellen Fortschritt obenrein grafisch darzustellen. Dazu nutzt man häufig einen Fortschrittsbalken. Einleuchtend ist die Anzeige eines Fortschrittsbalkens bspw. bei der Installation eines Programms oder einer App. Hier dürfte dabei jeder schon mal einen solchen Balken gesehen haben.

Aber auch beim Ausfüllen langer Formulare oder während eines Bestellvorgangs kann der aktuelle Fortschritt grafisch dargestellt werden. Hierzu gibt es mit CSS auch eine einfache Möglichkeit, dies zu tun.

Wie genau du mit CSS einen animierten Fortschrittsbalken in deine Website einfügen kannst, zeige ich dir dabei in diesem Artikel.

Weiterlesen …Animierter Fortschrittsbalken mit CSS

Hintergrundbild in HTML und CSS

Ein Hintergrundbild in die eigene Website einzufügen ist überhaupt kein Problem. Dabei gibt es auch verschiedene Wege, wie du das machen kannst. Der eleganteste Weg ist dabei sicherlich die Einbindung mit CSS. Dazu legst du dann in deinem Stylesheet fest, wo und wie der Browser das Hintergrundbild anzeigen soll. Ein anderer Weg ist über HTML direkt. Diese Methode gilt jedoch als veraltet.

Weiterlesen …Hintergrundbild in HTML und CSS

Bildwechsel bei Mouseover mit CSS

Schon seit sehr langer Zeit gibt es den Artikel „Grafik mit Mausberührung ändern lassen“ hier auf Webmasterparadies.de. In diesem Artikel stelle ich eine Möglichkeit vor, mit JavaScript eine Grafik bei Berührung mit dem Mauszeiger ändern zu lassen. Das ganze ist jedoch noch viel einfacher möglich. Du kannst ebenso einen Bildwechsel bei Mouseover mit CSS erzeugen.

In diesem Artikel zeige ich dir, wie das funktioniert.

Weiterlesen …Bildwechsel bei Mouseover mit CSS

Listen in HTML erstellen und gestalten

Im HTML-Standard gibt es schon seit sehr langer Zeit Tags, mit denen du Listen in HTML darstellen kannst.

In diesem Artikel stelle ich die verschiedenen Listen-Arten vor und wie du sie entsprechend in deine Website einbinden und gestalten kannst. Dies gehört zum HTML-Grundwissen und ist daher hauptsächlich für HTML-Anfänger interessant.

Weiterlesen …Listen in HTML erstellen und gestalten

Tabellen mit CSS erstellen

Schnöde, graue Tabellenrahmen müssen nicht sein. CSS bietet ebenfalls die Möglichkeit, Text in Tabellenform darzustellen. Dabei kann das Design der erstellten Tabellenform ganz einfach an die eigenen Bedürfnisse angepasst werden. Tabellen mit CSS erstellen ist dabei auch gar nicht schwer.

In diesem Artikel zeige ich dir, wie du mit CSS eine Tabelle erstellen und gestalten kannst, ohne dass du dabei auf die klassischen HTML-Tabellen zurückgreifen musst.

Weiterlesen …Tabellen mit CSS erstellen