Mögliche CSS Klassen für Artikel

  • Elemente die über die volle breite gehen sollen, benötigen immer die Klasse col-12
  • Die Klasse center zentriert den Text im ganzen Artikel
  • align-self-center richtet einen Artikel vertical mittig zum danebenliegenden Element aus
  • Die Spalten basieren auf Bootstrap - 12 Spalten
    col-xs- Media Querie 398 px
    col-sm- Media Querie 576 px
    col-md- Media Querie 767 px
    col-lg- Media Querie 992 px
    col-xl- Media Querie 1200 px

  • Scroll Animation
    Zoomt den Artikel ein
    CSS-Klasse: scrollflow -pop -opacity
    Slide von unten
    CSS-Klasse: scrollflow -slide-top -opacity
    Slide von oben
    CSS-Klasse: scrollflow -slide-bottom -opacity
    Slide von links
    CSS-Klasse: scrollflow -slide-right -opacity
    Slide von rechts
    CSS-Klasse: scrollflow -slide-left -opacity

  • Mögliche Klassen für Abstände
    pt-0 {padding-top:0px;}
    pt-20 {padding-top:20px;}
    pt-40 {padding-top:40px;}
    pt-60 {padding-top:60px;}
    pt-80 {padding-top:80px;}
    pb-0 {padding-bottom:0px;}
    pb-20 {padding-bottom:20px;}
    pb-40 {padding-bottom:40px;}
    pb-60 {padding-bottom:60px;}
    pb-80 {padding-bottom:80px;}
    mt-0 {margin-top:0px;}
    mt-20 {margin-top:20px;}
    mt-40 {margin-top:40px;}
    mt-60 {margin-top:60px;}
    mt-80 {margin-top:80px;}
    mb-0 {margin-bottom:0px;}
    mb-20 {margin-bottom:20px;}
    mb-40 {margin-bottom:40px;}
    mb-60 {margin-bottom:60px;}
    mb-80 {margin-bottom:80px;}

bg color

Headline

Überall dieselbe alte Leier. Das Layout ist fertig, der Text lässt auf sich warten. Damit das Layout nun nicht nackt im Raume steht und sich klein und leer vorkommt, springe ich ein: der Blindtext.

  • normale Liste

Headline

Überall dieselbe alte Leier. Das Layout ist fertig, der Text lässt auf sich warten. Damit das Layout nun nicht nackt im Raume steht und sich klein und leer vorkommt, springe ich ein: der Blindtext.

  • Liste - Artikel benötigt die Klasse "auflistung"

Headline

Überall dieselbe alte Leier. Das Layout ist fertig, der Text lässt auf sich warten. Damit das Layout nun nicht nackt im Raume steht und sich klein und leer vorkommt, springe ich ein: der Blindtext.

Bild Teaser mit HG

Layout-Platzhaltertext

Überall dieselbe alte Leier. Das Layout ist fertig, der Text lässt auf sich warten. Damit das Layout nun nicht nackt im Raume steht und sich klein und leer vorkommt, springe ich ein: der Blindtext. Genau zu diesem Zwecke erschaffen, immer im Schatten meines großen Bruders »Lorem Ipsum«.

Accordeon

Akkordeon Einzelelement

Überall dieselbe alte Leier. Das Layout ist fertig, der Text lässt auf sich warten. Damit das Layout nun nicht nackt im Raume steht und sich klein und leer vorkommt, springe ich ein: der Blindtext. Genau zu diesem Zwecke erschaffen

Akkordeon mit Inhaltsspalten
  • Das Layout ist fertig
  • der Text lässt auf sich warten

Überall dieselbe alte Leier. Das Layout ist fertig, der Text lässt auf sich warten. Damit das Layout nun nicht nackt im Raume steht und sich klein und leer vorkommt, springe ich ein: der Blindtext. Genau zu diesem Zwecke erschaffen

Bildergalerie