Tag Archives: css

Weblayouts & Design

Layout mit 2 Spalten, Header und Footer

Für alle die sich nicht mit dem Coden rumschlagen wollen, hier ein fertiges, 100% XHTML und CSS 2.1 valides Layout.

Hier handelt es sich um ein 2 Spalten Layout mit Header und Footer, es kann jedoch nach belieben erweitert und verändert werden.
Das Layout ist aufgeteilt in eine HTML-, und eine CSS-Datei. Die CSS-Datei ist kommentiert, damit man sich zurecht findet.

Das Layout kann man sich unter Weblayouts anschauen und herunterladen.

zp8497586rq
HTML & CSS

Button Hover mit CSS und ohne nachladen

Mit CSS ist es relativ einfach einen Hover-Effekt mit Buttons wie dem Oberen zu erzeugen. Alles was man braucht ist ein Bild, welches aus den beiden Grafiken des Buttons besteht. Also einmal die Grafik des Buttons wenn er nicht gehovert ist und einmal die Grafik des Buttons beim drüberfahren mit der Maus (hovern).

read more »

Weblayouts & Design

2 Spalten Layout mit Header und 2 Footern

Für alle die sich nicht mit dem Coden rumschlagen wollen, hier ein fertiges, 100% XHTML und CSS 2.1 valides Layout.

Hier handelt es sich um ein 2 Spalten Layout mit Header und 2 Footern, es kann jedoch nach belieben erweitert und verändert werden.
Das Layout ist aufgeteilt in eine HTML-, und eine CSS-Datei. Die CSS-Datei ist kommentiert, damit man sich zurecht findet.

Das Layout kann man sich unter Weblayouts anschauen und herunterladen.

zp8497586rq
HTML & CSS

Webseite horizontal und vertikal zentrieren

Eigentlich sollte es ja nicht so schwer sein, Webseiten horizontal und vertikal zu zentrieren. Was sich in der Theroie einfach anhört ist in der Praxis schon etwas kniffliger.

Hier zunächst ein Beispiel von dem was wir erreichen wollen:

So soll es aussehen

Erst mal die html-Datei. Diese sieht folgendermaßen aus:

<html>
  <head>
    <title>Webseite horizontal und vertikal zentrieren</title>
    <style type="text/css">
      ...
    </style>
  </head>
  <body>
    <div>
    </div>
  </body>
</html>

read more »