Vorlage:Spalten: Unterschied zwischen den Versionen

Aus Pufopedia
Zur Navigation springen Zur Suche springen
K (Nicorpunkt verschob die Seite Vorlage:Liste nach Vorlage:Spalten: Passendere Benennung der Funktionalität)
(Anpassung der Syntax, für die Darstellung auf mobilen Endgeräten wird immer ein column-width Wert angegeben.)
Zeile 1: Zeile 1:
<onlyinclude>
<onlyinclude>
<div {{#if: {{{breite|}}}| style="-moz-column-width:{{{breite}}}; -webkit-column-width:{{{breite}}}; column-width:{{{breite}}};" | {{#if: {{{spalte|}}}| style="-moz-column-count:{{{spalte}}}; -webkit-column-count:{{{spalte}}}; column-count:{{{spalte}}};" }} }} >{{{2|{{{1|}}} }}}</div></onlyinclude>
<div style="-moz-column-count: {{{anzahl|3}}}; -webkit-column-count: {{{anzahl|3}}}; column-count: {{{anzahl|3}}}; -moz-column-width:{{{mindestbreite|22em}}}; -webkit-column-width:{{{mindestbreite|22em}}}; column-width:{{{mindestbreite|22em}}};">{{{3|{{{2|{{{1|}}}}}}}}}
</div>
</onlyinclude>


Dynamische Liste
Diese Vorlage teilt einen vorgegebenen Inhalt auf mehrere gleich breite Spalten auf und verringert bei kleinen Bildschirmen (v.a. mobilen Endgeräten) automatisch die Spaltenanzahl.


== Vorlage ==
== Vorlage ==
<pre><nowiki>
<pre><nowiki>
{{Liste|spalte=X ODER breite=XXem|Inhalt}}
{{Spalten|anzahl=X|Inhalt}}
</nowiki></pre>
</nowiki></pre>
* Mit dem Parameter '''anzahl''' kann eine Maximalanzahl an Spalten vorgegeben werden. Dies ist, sinnvoll, um auf großen Bildschirmen keine unübersichtlich große Zahl an Spalten zu generieren. Der Standardwert ist 3.
* Mit dem Parameter '''mindestbreite''' kann die Mindestbreite für eine Spalte überschrieben werden. Die Mindestbreite gibt an, wann die Maximalanzahl an Spalten für eine gewisse Bildschirmgröße erreicht ist, es werden jedoch ''nie'' mehr Spalten gezeichnet, als vom '''anzahl'''-Parameter vorgegeben. Die Angabe erfolgt in der Form "Xem", was die X-fache Textgröße bedeutet. Der Standardwert ist 22em.


== Beispiele ==
== Beispiele ==
<pre><nowiki>
<pre><nowiki>
{{Liste|spalte=5|
{{Spalten|anzahl=5|Lorem ipsum dolor sit amet, consetetur sadipscing elitr...}}</nowiki></pre>
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
}}</nowiki></pre>


… wird zu:
… wird zu:
{{Liste|spalte=5|
{{Spalten|spalte=5|Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.  
* Lorem ipsum dolor sit amet.
 
* Lorem ipsum dolor sit amet.
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.  
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
}}
}}
=== Verwendung mit Listen ===
Häufig werden mehrspaltige Inhalte in Verbindung mit Listen eingesetzt, um kurze Listeneinträge platzsparend unterzubringen.


<pre><nowiki>
<pre><nowiki>
{{Liste|breite=10em|
{{Spalten|anzahl=3|* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
Zeile 59: Zeile 45:


… wird zu:
… wird zu:
{{Liste|breite=10em|
{{Spalten|anzahl=3|
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
Zeile 73: Zeile 59:
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
}}
}}
Fließtext ist auch möglich:
<pre><nowiki>
{{Liste|spalte=3|TEXTINHALT}}
</nowiki></pre>
… wird zu:
{{Liste|spalte=3|
''Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras et lacinia purus. Fusce placerat odio interdum ante maximus, a sodales sem mattis. Maecenas non commodo ante. Morbi hendrerit ullamcorper eleifend. Nulla euismod tincidunt rhoncus. Etiam commodo dui eu pellentesque rhoncus. Nam vel fringilla mi, quis semper felis. Vestibulum at volutpat enim. Ut id nisl maximus, mollis nulla vitae, maximus diam.''
'''Etiam sagittis libero id finibus posuere. Sed tempus suscipit sodales. Praesent tempus velit et neque cursus, quis maximus elit consequat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin blandit condimentum pharetra. In consectetur tincidunt fermentum. Quisque justo erat, porttitor id pellentesque blandit, placerat sed nisi. Ut id lorem rutrum, aliquam justo at, viverra mauris. Nunc venenatis diam sit amet mauris eleifend ornare. Quisque hendrerit eros non tempus sodales.'''
Morbi eu libero ut orci laoreet imperdiet eu sollicitudin augue. Morbi quis vestibulum lectus. Proin nec dui metus. Vivamus maximus lacinia massa, eu finibus leo consectetur vitae. Curabitur a metus ut enim sodales euismod vel id quam. Sed eu quam sagittis, pharetra orci et, egestas enim. Vestibulum vulputate molestie elit, ac vulputate justo pharetra vitae. Nulla imperdiet, purus in fringilla placerat, purus tortor condimentum lorem, vitae molestie velit massa sed nunc. Duis vulputate in nibh sed suscipit. Ut sed congue eros, vel ullamcorper purus. Duis nisl elit, elementum eget ex feugiat, molestie blandit leo. Donec auctor tempus magna, vitae blandit ligula porttitor eu. Praesent posuere eros metus.}}

Version vom 3. Februar 2020, 22:18 Uhr


Diese Vorlage teilt einen vorgegebenen Inhalt auf mehrere gleich breite Spalten auf und verringert bei kleinen Bildschirmen (v.a. mobilen Endgeräten) automatisch die Spaltenanzahl.

Vorlage

{{Spalten|anzahl=X|Inhalt}}
  • Mit dem Parameter anzahl kann eine Maximalanzahl an Spalten vorgegeben werden. Dies ist, sinnvoll, um auf großen Bildschirmen keine unübersichtlich große Zahl an Spalten zu generieren. Der Standardwert ist 3.
  • Mit dem Parameter mindestbreite kann die Mindestbreite für eine Spalte überschrieben werden. Die Mindestbreite gibt an, wann die Maximalanzahl an Spalten für eine gewisse Bildschirmgröße erreicht ist, es werden jedoch nie mehr Spalten gezeichnet, als vom anzahl-Parameter vorgegeben. Die Angabe erfolgt in der Form "Xem", was die X-fache Textgröße bedeutet. Der Standardwert ist 22em.

Beispiele

{{Spalten|anzahl=5|Lorem ipsum dolor sit amet, consetetur sadipscing elitr...}}

… wird zu:

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.


Verwendung mit Listen

Häufig werden mehrspaltige Inhalte in Verbindung mit Listen eingesetzt, um kurze Listeneinträge platzsparend unterzubringen.

{{Spalten|anzahl=3|* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
* Lorem ipsum dolor sit amet.
}}

… wird zu:

  • Lorem ipsum dolor sit amet.
  • Lorem ipsum dolor sit amet.
  • Lorem ipsum dolor sit amet.
  • Lorem ipsum dolor sit amet.
  • Lorem ipsum dolor sit amet.
  • Lorem ipsum dolor sit amet.
  • Lorem ipsum dolor sit amet.
  • Lorem ipsum dolor sit amet.
  • Lorem ipsum dolor sit amet.
  • Lorem ipsum dolor sit amet.
  • Lorem ipsum dolor sit amet.
  • Lorem ipsum dolor sit amet.