About Us

About Us. Ein paar Worte über uns.

Übrigens: Wer mag, kann auf jeder Seite auch statt der Farbe ein anderes Bild im oberen Bereich einfügen. Wir haben es als Beispiel mal für die Seite Sextus [ ] (index6.html) angelegt.

Hier Beispieltext per Lorem Ipsum. Id vel voluptua invidunt, euismod deseruisse ei eam, eam ex salutandi efficiendi. Alia cibo nihil eum no. Illum nobis integre eos ne, ex mei augue quaestio, et salutandi referrentur eos. Oratio invenire ei cum, no suas dicam deleniti duo. Sit omnium periculis splendide ex, vix ei assum adversarium, easum sedamus.

Causae aliquam evertitur mel ei, eros prompta argumentum ad mei, maiorum corrumpit efficiantur ne cum. No vel purto mutat mazim, voluptua eloquentiam duo ex. At solet perfecto dissentiunt cum. Populo suscipit intellegat no nec. Assum eligendi quo at.

Weiter [ ]
.

 

Unsere Philosophie

Box 'Philosophie'.Vis et paulo graeco integre. Id vel nonumes evertitur. Idque adipiscing ut sea, tantas laudem legere sea eu, has sale etiam ea. Ad vis unum debet perpetua, sit veri mazim no. No est convenire iudicabit, ex eum mucius salutandi. Exerci perfecto oportere no sea.



Elementum

Lorem ipsum dolor sit amet, meliore consectetuer definitiones in per. Eu suas vituperata ius, errem legendos cu pro. Vis dicant principes ei. [ ]

Fabrica

Scripta legimus cum ad, viris laboramus voluptaria eu nam. Has nostro diceret appareat ut, invidunt prodesset dissentiet sed ei, nostro eligendi sit. [ ]

Memoria

Ad mel laudem offendit, ei vis dignissim forensibus, mea et iuvaret labores scripserit. Iudico doctus sadipscing te vis, an natum atomorum honestatis. [ ]

 

Die Technik

Einbau der Bilder

Bei den Fotos im Inhaltsbereich haben wir uns für die CSS-Technik mit 'display:inline-block' entschieden. Wir beschreiben es Ihnen hier in einem Tutorial auf der Seite 'Quartus' (index4.html)

Transparente PNG-Grafiken

Anbei sind verschiedene PNG-Grafiken, nämlich die Segelboote. Es gibt diese in den Farben Rot, Grün, Blau und Gelb sowie jeweils noch einmal ohne die Ziffern 1-4. Außerdem ist noch eine Blanko-Version in der Farbe Weiss dabei.

Lightbox Picture Gallery

Wir haben in diesem Template die bekannte, beliebte und bewährte 'Lightbox' Foto-Gallerie eingebaut. Klicken Sie bitte dazu auf die Fotos. Sie finden die Gallery auf gleich auf dieser Seite Home (index.html) und zwar beim Abschnitt 'Gallery'.

 

Gallery

 

Informationen

Template

Dieses Template heißt ' Auf meinem Boot ... '. Die sechs 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.

Das Menü

Unser Menü ist responsive und nur per CSS erstellt. Es funktioniert ganz ohne Javascript und ist außerdem 'touch-friendly', d.h. es läuft auch auf mobilen Geräten.

Bei mobilen Auflösungen erscheint nur der sog. Hamburger Menü-Button (3 Striche, quer als Menü-Symbol). Um das Menü dort zu öffen, klicken Sie bitte auf den Hamburger Menü-Button. Die 6 Links werden bei mobilen Auflösungen sanft eingeblendet und sind sowohl horizontal als auch vertikal zentriert im Logo-Bereich angeordnet.

 

News

Man könnte die Links hier auf eine ausführliche News-Seite mit kompletten News verlinken.

06.10.25 | Weiter [ ]
Sale tibique te sit, et mei nostro everti dignissim. Nam simul suscipit moderatius.

11.08.25 | Weiter [ ]
Dicat dissentiunt no nam, ne integre volutpat sit, eu vix possim theophrastus. Qui lorem.

24.07.25 | Weiter [ ]
Saepe. Sea ex nonumy aliquam, sit posse nominavi corrumpit no. Viris delectus cu pro.

09.05.25 | Weiter [ ]
.

 

Responsive Webdesign

Responsive Webdesign

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 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.

Adresse

  • Firma
  • Mustermann & Partner GmbH
  • Sample-Nowhere-Street 232 A
  • 12345 Big City Of Nowhere

Kontakt

  • Phone: (0000) 0000000-50
  • Mobile 1 : (+49) 0000-1234567
  • Mobile 2 : (+49) 0000-7854321
  • Fax: (0000) 7654321-4141
  • info@muster-mustermann.de
© 2025 | Auf meinem Boot