Șablon: Coloane

Instructiuni de folosire
Instrucțiunile de mai jos sunt conținute în subpagina Șablon: Coloane / om ( modificări · istoric )
Sandbox: Șablon: Coloane / Sandbox ( editare · istoric ) · Toate subpagini: listă

Șablonul {{ Coloane }} este utilizat pentru a împărți conținutul paginii în coloane autoadaptabile. Coloanele se întind pe orizontală atât timp cât au loc, apoi coboară vertical pe măsură ce fereastra sau ecranul se micșorează. Spre deosebire de șablonul {{ Div col }}, specificați manual conținutul fiecărei coloane astfel încât să fie indivizibil în cadrul acesteia.

Sintaxă

 {{Coloane}}
Acest text apare în prima coloană.
{{Coloane de rupere}}
Acest text apare în a doua coloană.
{{Coloane de rupere}}
Acest text apare în a treia coloană.
{{Coloanele se termină}}

Rezultat

Puteți avea orice număr de coloane. Fiecare coloană încearcă să se aranjeze orizontal în funcție de spațiul disponibil și are un mic spațiu de 20 de pixeli în dreapta pentru a preveni contactul cu textul din coloana următoare. Dacă nu există suficient spațiu orizontal, coloanele trec treptat vertical cu o întoarcere a căruciorului.

Atenție: când ecranul este prea mic, șablonul refuză automat să distribuie coloanele pe orizontală pentru a evita aglomerarea textului.

Parametrii

Există doi parametri opționali, care pot fi evaluați cu sau fără un nume.

• Primul parametru sau „lățime”: lățimea totală a setului de coloane. Poate fi o valoare absolută (în centimetri , inci , pixeli , ems etc., de exemplu 12cm ) sau relativă (în procente) cu lățimea paginii (de exemplu 50% ).
• Al doilea parametru sau „css”: stiluri HTML suplimentare (de exemplu, background-color:... ).

Exemple de utilizare

Normal

Pentru a crea o secțiune cu mai multe coloane pe o pagină (în acest exemplu, o listă de nume proprii) în care spațiul disponibil este 100%, introduceți următoarele rânduri:

 {{Coloane}}
*Andrew
* Antonio
* Bruno
* Carlo
{{Coloane de rupere}}
* Francisc
* Iosif
* Marco
* Paola
{{Coloane de rupere}}
* Roberto
* Sabrina
*Salvator
* Silvia
{{Coloanele se termină}}

Rezultat

Lățimi diferite

Pentru a crea o secțiune cu mai multe coloane pe o pagină în care spațiul disponibil este de numai 50%, introduceți următoarele linii:

 {{Coloane | 50%}}
Acest text apare în prima coloană.
{{Coloane de rupere}}
Acest text apare în a doua coloană.
{{Coloane de rupere}}
Acest text apare în a treia coloană.
{{Coloanele se termină}}

Rezultat

Aliniere text

Textul coloanei este aliniat la stânga în mod implicit. Pentru a-i schimba alinierea, completați parametrul css cu text-align setat la center sau la right , astfel:

 {{Coloane | css = text-align: right}}
Acest text apare în prima coloană.
{{Coloane de rupere}}
Acest text apare în a doua coloană.
{{Coloane de rupere}}
Acest text apare în a treia coloană.
{{Coloanele se termină}}

Rezultat

Liste numerotate

Pentru a împărți o listă numerotată în mai multe coloane, păstrând în același timp numerotarea intactă, trebuie utilizat un mic expedient: în coloanele următoare primei trebuie să „forțezi” prima valoare ( <li value= X > ) și apoi să folosești HTML <li> eticheta la locul # . Evident, numerotarea este actualizată automat odată cu inserarea de noi elemente în listă.

 {{Coloane}}
# LA
# B
# C
# D
{{Coloane de rupere}}
<ol>
<li value = 5> E </li>
<li> F </li>
<li> G </li>
<li> H </li>
</ol>
{{Coloane de rupere}}
<ol>
<li value = 9> I </li>
<li> L </li>
<li> M </li>
<li> N </li>
</ol>
{{Coloanele se termină}}

Rezultat

Șabloane conexe

• Model: Div col
• Șablon: Div col end