Template:Colonne

Da Wikipedia, l'enciclopedia libera.
Questa pagina è protetta
Template protetto – Le modifiche possono essere proposte nella pagina di discussione.
Questa pagina è protetta dallo spostamento
Info Istruzioni per l'uso
Le istruzioni che seguono sono contenute nella sottopagina Template:Colonne/man (modifica·cronologia)

Il template {{Colonne}} serve per iniziare una sezione multi-colonna in una pagina di Wikipedia.

Sintassi

{{Colonne}}
Questo testo appare nella prima colonna.
{{Colonne spezza}}
Questo testo appare nella seconda colonna.
{{Colonne spezza}}
Questo testo appare nella terza colonna.
{{Colonne fine}}
Risultato

Questo testo appare nella prima colonna.

Questo testo appare nella seconda colonna.

Questo testo appare nella terza colonna.

Si può avere qualsiasi numero di colonne. Ogni colonna ha la stessa larghezza, equamente divisa in base allo spazio disponibile orizzontalmente. Ogni colonna ha un piccolo margine destro (20 pixel), che serve per prevenire il contatto fra il testo di una colonna con quello della colonna alla sua destra.

Attenzione: si raccomanda di non superare le 3 colonne, per il problemi di sovrapposizione delle stesse quando un utente può usare caratteri grandi di visualizzazione.

Parametri

Ci sono due parametri opzionali, valorizzabili con o senza nome.

  • Primo parametro o "width": larghezza totale dell'insieme delle colonne. Può essere un valore assoluto (ad esempio 12cm) o relativo rispetto alla larghezza della pagina (ad esempio 50%) oppure auto per adattare la larghezza al contenuto. Il valore di default del parametro è 100%.
  • Secondo parametro o "css": stili HTML aggiuntivi (ad esempio background-color:...).

Esempi di utilizzo

Normale

Per creare una sezione multi-colonna in una pagina (in questo esempio, una lista di nomi propri) in cui lo spazio disponibile è del 100%, inserire le seguenti righe:

{{Colonne}}
*Andrea
*Antonio
*Anselmo
*Carlo
{{Colonne spezza}}
*Francesco
*Giuseppe
*Marco
*Paola
{{Colonne spezza}}
*Roberto
*Sabrina
*Salvatore
*Silvia
{{Colonne fine}}
Risultato
  • Andrea
  • Antonio
  • Anselmo
  • Carlo
  • Francesco
  • Giuseppe
  • Marco
  • Paola
  • Roberto
  • Sabrina
  • Salvatore
  • Silvia

Larghezze differenti

Per lasciare che le colonne si adattino alla larghezza del contenuto, compattandosi a sinistra, aggiungere "auto":

{{Colonne|auto}}
*Andrea
*Antonio
*Anselmo
*Carlo
{{Colonne spezza}}
*Francesco
*Giuseppe
*Marco
*Paola
{{Colonne spezza}}
*Roberto
*Sabrina
*Salvatore
*Silvia
{{Colonne fine}}
Risultato
  • Andrea
  • Antonio
  • Anselmo
  • Carlo
  • Francesco
  • Giuseppe
  • Marco
  • Paola
  • Roberto
  • Sabrina
  • Salvatore
  • Silvia

Per creare una sezione multi-colonna in una pagina in cui lo spazio disponibile è solo del 50%, inserire le seguenti righe:

{{Colonne|50%}}
Questo testo appare nella prima colonna.
{{Colonne spezza}}
Questo testo appare nella seconda colonna.
{{Colonne spezza}}
Questo testo appare nella terza colonna.
{{Colonne fine}}
Risultato

Questo testo appare nella prima colonna.

Questo testo appare nella seconda colonna.

Questo testo appare nella terza colonna.

Colonne centrate

La "regione" multi-colonna è sempre posizionata sul lato sinistro. Per modificarne la posizione, inserire nel codice di sintassi inserito per creare la sezione multi-colonna un blocco DIV che ha l'attributo CSS text-align settato su center oppure su right, così:

<div style="text-align: center">
{{Colonne|50%}}
Questo testo appare nella prima colonna.
{{Colonne spezza}}
Questo testo appare nella seconda colonna.
{{Colonne spezza}}
Questo testo appare nella terza colonna.
{{Colonne fine}}
</div>
Risultato

Questo testo appare nella prima colonna.

Questo testo appare nella seconda colonna.

Questo testo appare nella terza colonna.

Elenchi numerati

Per spezzare su più colonne un elenco numerato mantenendo intatta la numerazione si deve ricorrere a un piccolo espediente: nelle colonne successive alla prima bisogna "forzare" il primo valore (<li value= ''X'' > ) e poi usare il tag HTML (<li>) al posto di #. Ovviamente si ha l'aggiornamento automatico della numerazione con l'inserimento di nuovi elementi nell'elenco.

{{Colonne}}
# A
# B
# C
# D
{{Colonne spezza}}
<ol>
<li value=5 > E
<li>  F
<li> G
<li> H
</ol>
{{Colonne spezza}}
<ol>
<li value=9 > I
<li> L
<li> M
<li> N
</ol>
{{Colonne fine}}
Risultato
  1. A
  2. B
  3. C
  4. D
  1. E
  2. F
  3. G
  4. H
  1. I
  2. L
  3. M
  4. N

Template correlati

Template Vantaggi Svantaggi
{{Colonne}}
  • Permette di spezzare le colonne a piacimento grazie a {{Colonne spezza}};
  • dà un aspetto omogeneo anche con i browser più vecchi;
  • permette di utilizzare anche solo parzialmente la larghezza dello schermo.
  • Utilizza le tabelle;
  • occorre ricalibrare manualmente le colonne quando si aggiungono o rimuovono elementi in una lista;
  • occorre fare qualche magia - <ol start="numero ultimo elemento colonna precedente + 1"> - per gestire gli elenchi numerati;
  • ha problemi di sovrapposizione quando ci sono immagini flottanti a destra.
{{div col}}
  • Utilizza i CSS e non le tabelle;
  • funziona correttamente con i browser basati su WebKit (Safari, Chrome…), Gecko (Firefox…), Presto (Opera) e Trident (solamente a partire da Internet Explorer 10);
  • nei browser che non lo supportano le colonne sono ignorate, ma non è compromessa la leggibilità;
  • non ha problemi di sovrapposizione con le immagini flottanti;
  • il contenuto si ridispone automaticamente quando si aggiungono nuovi elementi;
  • non ha problemi né con gli elenchi puntati né con quelli numerati;
  • potrebbe essere possibile inserire una preferenza per far variare a piacimento dell'utente il numero di colonne.
  • Utilizza attributi CSS non ancora ratificati;
  • utilizza la stessa tecnica usata da {{references}} quando si specifica il numero di colonne;
  • non funziona con le versioni di Internet Explorer (basato su Trident) precedenti alla 10;
  • attualmente non è possibile spezzare una colonna a piacimento.