Differenze tra le versioni di "Template:Col"
m (→Utilizzo multi-riga: fix lettere) |
(→Funzionamento: più info) |
||
| Riga 4: | Riga 4: | ||
Rispetto ad una tabella tradizionale, questo sistema viene solitamente adottato nel web design per poter creare vari layout creativi e adattabili sia per desktop che mobile. | Rispetto ad una tabella tradizionale, questo sistema viene solitamente adottato nel web design per poter creare vari layout creativi e adattabili sia per desktop che mobile. | ||
| − | == Funzionamento == | + | == Funzionamento generale == |
| − | + | Per definire una "colonna" si usa il template {{Tl|col|larghezza}}...{{Tl|/col}} personalizzando la ''larghezza'' della colonna con un numero intero da 1 a 6. Le colonne vivono in una "riga". | |
| − | + | Per definire una "riga" si usa il template {{Tl|row}}...{{Tl|/row}}. Una riga può contenere varie colonne per un massimo di 6 slot (ad esempio: una colonna da 6, oppure sei piccole colonne da 1, etc.). | |
== Esempi == | == Esempi == | ||
Versione delle 10:13, 20 mar 2022
Il template {{col}} permette di disporre i contenuti in una griglia, assegnandoli in determinate colonne.
Rispetto ad una tabella tradizionale, questo sistema viene solitamente adottato nel web design per poter creare vari layout creativi e adattabili sia per desktop che mobile.
Funzionamento generale
Per definire una "colonna" si usa il template {{col|larghezza}}...{{/col}} personalizzando la larghezza della colonna con un numero intero da 1 a 6. Le colonne vivono in una "riga".
Per definire una "riga" si usa il template {{row}}...{{/row}}. Una riga può contenere varie colonne per un massimo di 6 slot (ad esempio: una colonna da 6, oppure sei piccole colonne da 1, etc.).
Esempi
Esempio base a due colonne
Esempio di utilizzo base nel wikitesto:
{{row}}
{{col|3|violet}}A{{/col}}
{{col|3|violet}}B{{/col}}
{{/row}}
Risultato:
Esempio base multi-colonna
Esempio di utilizzo base nel wikitesto:
{{row}}
{{col|1|violet}}A{{/col}}
{{col|1|brown }}B{{/col}}
{{col|1|red }}C{{/col}}
{{col|1|aqua }}D{{/col}}
{{col|1|green }}E{{/col}}
{{/row}}
Risultato:
Altro esempio base
Esempio di utilizzo base nel wikitesto:
{{row}}
{{col|2|violet}}A{{/col}}
{{col|1|brown }}B{{/col}}
{{col|1|red }}C{{/col}}
{{col|2|aqua }}D{{/col}}
{{/row}}
Risultato:
Utilizzo multi-riga
Esempio di utilizzo base nel wikitesto:
{{row}}
{{col|6|violet}}A{{/col}}
{{/row}}
{{row}}
{{col|3|brown }}B{{/col}}
{{col|3|red }}C{{/col}}
{{/row}}
{{row}}
{{col|2|aqua }}D{{/col}}
{{col|2|green }}E{{/col}}
{{col|2|violet}}F{{/col}}
{{/row}}
Risultato:
Utilizzi innestati
Esempio di utilizzo base nel wikitesto:
{{row}}
{{col|6|violet}}
A
{{row}}
{{col|3|brown }}B{{/col}}
{{col|3|red }}C{{/col}}
{{/row}}
D
{{/col}}
{{col|6|brown}}
E
{{row}}
{{col|3|aqua }}F{{/col}}
{{col|3|green}}G{{/col}}
{{/row}}
H
{{/col}}
{{/row}}
A
E
H Template:Col/col Template:Col/row
Non documentati
Esempio di utilizzo base nel wikitesto:
{{row}}
{{col|6|violet}}A{{/col}}
{{col|6|brown }}B{{/col}}
{{col|6|red }}C{{/col}}
{{col|6|aqua }}D{{/col}}
{{col|6|green }}E{{/col}}
{{col|1|violet}}F{{/col}}
{{col|1|brown }}G{{/col}}
{{col|1|red }}H{{/col}}
{{col|1|aqua }}I{{/col}}
{{col|1|green }}L{{/col}}
{{/row}}
Risultato: