Zweispaltig Sidebar Links
contentbox right
Das ist eine rechte Contentbox. Contentboxen werden in der Regel als Aufmacher (Teaser) verwendet.
Wenn man in der Lage ist, ein wenig im Quelltext zu arbeiten, kann man diese flexiblen Contentboxen erstellen. Unterhalb von ca. 760px horizontaler Bildschirmauflösung floaten sie untereinander, den Umschaltpunkt kann man einfach im CSS-Code ändern.
contentbox left
Das ist eine linke Contentbox. Contentboxen werden in der Regel als Aufmacher (Teaser) verwendet.
Der CSS-Code für die Contentboxen ist in den neueren Templates von ge-webdesign.de bereits enthalten. Dieser CSS-Code ist für jedes Template ein wenig anders, weil er natürlich zum Template Design passen muss.
Mehr zum Thema Contentboxen »
contentbox fullsize
Das ist eine Contentbox in voller Breite. Contentboxen werden in der Regel als Aufmacher (Teaser) verwendet. Sie können aber auch aus rein gestalterischen Gründen eingesetzt werden, z. B. um bestimmte Inhalte hervorzuheben oder zu bündeln.
Newsboxen
Die Newsboxen sollten mit einer h1-h4 beginnen, damit sie so aussehen wie auf dieser Demoseite.
Überschriften
In CMSimple 5 können, wenn das H1only_pagesplitting aktiviert ist, alle Überschriften (h1-h6) auf CMSimple Seiten zur semantischen Gliederung des Seiteninhalts verwendet werden:
Überschrift h1
Überschrift h2
Überschrift h3
Überschrift h4
Überschrift h5
Überschrift h6
Zitatblock
"Wer Visionen hat, sollte zum Arzt gehen"
(Helmut Schmidt im Bundestagswahlkampf 1980)
Infobox
Das ist eine speziell gestaltete Box, die Klasse ist tplge_box01. Diese CSS Klasse kann allen Elementen zugeordnet werden, z. B. Absätzen (<p class="tplge_box01">) oder Bereichen (<div class="tplge_box01">).
Codebox
<div>
<img class="tplge_right_border" src="./userfiles/images/bild5.jpg" alt="">
</div>
CSS-Klassen für Bilder:
- img.tplge_border
- img.tplge_left_border
- img.tplge_right_border (siehe Bild oben rechts)
- img.tplge_noborder
- img.tplge_left_noborder
- img.tplge_right_noborder
- img.tplge_left
- img.tplge_right
- img.tplge_centered
Geordnete Liste
- Langer Listenpunkt, der einen Zeilenumbruch verursacht, um die Zeilenhöhe innerhalb eines Listenpunktes testen und einstellen zu können.
- Listenpunkt
- Listenpunkt
- Listenpunkt
Tabellen
Eines vorab: Tabellen sollten nur im Ausnahmefall zu Design- oder Layoutzwecken verwendet werden. Denken Sie daran, dass der Anteil der Website-Besuche mit mobilen Geräten ständig steigt.
Tabelle im Design "grey":
| Ein wenig Inhalt in der Tabellenzelle, um das Verhalten der Tabelle unter verschiedenen Bedingungen zu testen. | Ein wenig Inhalt |
| Ein wenig Inhalt in der Tabellenzelle | Ein wenig Inhalt |
| Ein wenig Inhalt in der Tabellenzelle | Ein wenig Inhalt in der Tabellenzelle |
Tabelle im Design "white":
| Ein wenig Inhalt in der Tabellenzelle | Ein wenig Inhalt in der Tabellenzelle |
| Ein wenig Inhalt in der Tabellenzelle | Ein wenig Inhalt in der Tabellenzelle, um das Verhalten der Tabelle unter verschiedenen Bedingungen zu testen. |
| Ein wenig Inhalt | Ein wenig Inhalt in der Tabellenzelle, um das Verhalten der Tabelle unter verschiedenen Bedingungen zu testen. |
Tabelle im Design "transparent":
| Ein wenig Inhalt in der Tabellenzelle, um das Verhalten der Tabelle unter verschiedenen Bedingungen zu testen. | Ein wenig Inhalt in der Tabellenzelle |
| Ein wenig Inhalt in der Tabellenzelle, um das Verhalten der Tabelle unter verschiedenen Bedingungen zu testen. | Ein wenig Inhalt in der Tabellenzelle |
| Ein wenig Inhalt in der Tabellenzelle | Ein wenig Inhalt |
