Start Homepage

Information

Wir alle lieben doch die kleine Kaffee-Pause. Es ist ein überaus liebgewonnenes Ritual. Die Bilder im Inhaltsbereich plus die Box mit dem Homepagenamen besitzen einen Lichtteffekt (nur per CSS) und erhellen damit den Hintergrundbereich. Die Seiten 'Home' (diese Seite) bis Sextus, sind bereits als Beispiel verlinkt.
Bitte klicken Sie diese, um zusätzliche Infos zu erfahren und zu sehen wie die Unterseiten angelegt sind. Es gibt nicht nur bei mobilen Auflösungen sondern bei allen Auflösungen den Menü-Button ganz oben rechts.

Bilder sagen mehr als Worte. Eine Foto-Gallerie finden Sie hier bei Quintus und Quartus. Anhand dieser Beispiele sehen Sie, das die Anzahl der Fotos frei wählbar und unendlich ist. Bei Klick auf einem Bild der Foto-Gallerie lassen sich dann sämtliche Fotos innerhalb dieser Kategorie per Klick auf Linkspfeil oder Rechtspfeil durchsehen. Es gibt dabei auch einen Bildtitel sowie eine Bildanzeige (Bild X von X). Hinweis: Diese Gallerie ist mit Hilfe eines Jquery-Scripts getätigt. Jquery ist die beliebteste Javascript Bibliothek, die das Arbeiten mit Javascript vereinfacht. Viel Spaß damit!


Responsive Webdesign

CSS Media Queries

Responsive Webdesign (RWD) ermöglicht eine Anpassung bzw. Optimierung der unterschiedlichen Bildschirmgrößen von Smartphone, Tablet, Notebook, Laptop und Desktop-PC innerhalb einer einzigen Webseite.
Dazu werden per CSS-Media Queries die verschiedenen Bildschirmgrössen abgefragt. Somit kann man auch auf das Hoch- oder Querformat eines mobilen Gerätes reagieren. Außerdem wird beim Layout verstärkt mit Angaben in Prozent gearbeitet.

So testen Sie

Hier auf der Seite Primus (index1.html) nennen wir Ihnen gute Möglichkeiten ein Responsive-Layout in verschiedenen Auflösungen zu testen, denn nicht jeder hat ja diverse Smartphones und Tablets zu Hause. Zum Testen benötigen Sie nur Ihren Internet-Browser. Also los geht es.


Liste speziell, animiert und verlinkt

Mit animiertem Font-Icon. Fahren Sie mit der Maus über den Link.


Es läßt sich natürlich auch ein anderes Font-Icon einsetzen. Lesen Sie hier zu den Icons auch die Seite Quartus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui.


Responsive Webdesign

CSS Media Queries

Responsive Webdesign (RWD) ermöglicht eine Anpassung bzw. Optimierung der unterschiedlichen Bildschirmgrößen von Smartphone, Tablet, Notebook, Laptop und Desktop-PC innerhalb einer einzigen Webseite.
Dazu werden per CSS-Media Queries die verschiedenen Bildschirmgrössen abgefragt. Somit kann man auch auf das Hoch- oder Querformat eines mobilen Gerätes reagieren. Außerdem wird beim Layout verstärkt mit Angaben in Prozent gearbeitet.

So testen Sie

Hier auf der Seite Primus (index1.html) nennen wir Ihnen gute Möglichkeiten ein Responsive-Layout in verschiedenen Auflösungen zu testen, denn nicht jeder hat ja diverse Smartphones und Tablets zu Hause. Zum Testen benötigen Sie nur Ihren Internet-Browser. Also los geht es.