Terra
 
 


Aqua
 
 


Ignis
 
 


Aerea
 
 


Home

Information

Willkommen

Liebe Besucher, wir begrüßen Sie bei uns. Schön, das wir Ihr Interesse geweckt haben. Nachstehend einige Informationen für Sie.

Animationen

Bei Mausberührung bzw. Touch finden Sie auf den Fotos im Inhaltsbereich eine zweifache Animation. Einerseits gibt es einen Bild-Effekt, andererseits eine Textüberlagerung mit Schiebe-Effekt, wobei die Textüberlagerung zeitlich nur wenig später geschaltet ist - erst das macht es perfekt, da beide Effekte so optisch gut erkennbar sind.

Der Bild-Effekt wir hierbei je nach Foto variert, so gibt es einen ZOOM-IN-Effekt, einen FLIPP-Effekt, einen SLIDE-OUT-RIGHT-Effekt, einen VERZERR-Effekt oder einen ZOOM-OUT-Effekt.

Möchte man keine Animation, so lassen sich die Bilder auch einfacher einbauen. Wir zeigen es auf der seite index4.html (Quartus).

Bereits verlinkt

Das Hauptmenü (Primus bis Sextus) haben wir bereits beispielhaft verlinkt. Bitte klicken Sie die Links. Die rechtlichen Links namens Impressum, Datenschutz und Disclaimer sind ebenfalls verlinkt.


 
Es ist angerichtet. Drei Donuts. Zuckersüß. Greifen Sie doch zu. Die rote Serviette auf dem weißen Teller ist als Raute gelegt und macht den Style aus. Food-Styling. Denn das Auge ißt doch mit. Guten Appetit!
 
"Ich bin Rotkäppchen. Möchten Sie meinen Kuchen probieren?"


Responsive

Responsive Webdesign

Responsive Webdesign (RWD) ermöglicht eine Anpassung/Optimierung der extrem unterschiedlichen Bildschirmgrößen von Smartphone, Tablet, Notebook, Laptop und Desktop-PC innerhalb einer einzigen Webseite. Dazu werden per CSS3-Media Queries die verschiedenen Bildschirmgrössen abgefragt. Außerdem wird beim Layout verstärkt mit Prozent-Angaben gearbeitet.

Technik

Diese Responsive-Vorlage verwendet keinerlei Javascript. Weder für die Navigation noch für das Ansprechen der CSS3-Media Queries bei älteren Browsern. Auch die Animationen sind ohne Javascript gestaltet, nämlich nur per CSS. Hier auf der Seite index1.html (Primus) 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.


 
Für Dich soll es rote Rosen regen!


Icons

Wir verwenden Font-Icons

Font-Icons sind sozusagen grafisch wirkende Schriftzeichen, die aber wie normaler Text behandelt werden (denn es sind ja Textzeichen) und damit eine schnellere und leichtere Formatierung gegenüber grafischen Icons per Bildformat (z.b. gif, jpg oder png) ermöglichen. Wir haben so eine kostenlose Icon-Schrift in dieser Vorlage bereits anbei. Sie heißt "Fontawesome".

Tipps zu den Font-Icons

Viele weitere Icons sind möglich, denn die Icon-Schrift "FontAwesome" ist ja bereits in dieser Vorlage installiert. So fügen Sie ggfls. weitere Icons hinzu oder ersetzen die vorhandenen. Der nachfolgende Link zum Anbieter zeigt weitere Infos sowie auch eine Übersicht aller Icons: fontawesome

Follow Social Media



Facebook
 
 


Twitter
 
 


Instagram
 
 


Google +
 
 

Wir haben hier für Sie die Icons noch weiter optimiert, da der Anbieter auch eigene CSS-Klassen befürwortet. Sie sehen es zum Beispiel vorstehend bei den Social Media Icons in Form der Butttons.


Fotos

Hinweis zu den Fotos

Die Fotos in dieser Vorlage sind von https://picjumbo.com/ Wir haben diese responsive angelegt. Gerne können Sie natürlich auch Ihre eigenen Fotos verwenden.


Mea id probo

Infobox officiis assueverit per id, facilisis disputando id eam, vim justo iuvaret atomorum te. Ne qui probo iriure argumentum, elaboraret scribentur et eos, est munere aperiam repudiare an. Est eu aliquip consequuntur, antiopam patrioque mel et, cum ex impetus nominavi. Eam ne augue sonet oportere. Et option necessitatibus vim, ius at facilis sensibus.
Birthday. Cake viva patrioque vel, eum everti detracto no, partem delectus eum in. Mea primis fuisset instructior an, mel quaestio abhorreant cu, ea esse velit ius.
Pencil. Rezept cu vix, halleluja nominati platonem ea has, te ius appareat vivendum pertinacia. Cu malis definitionem per, unum definitiones ad sit.
meine-webseite-url.de