Utente:Gvf/Template sinottici con uso delle classi
Vai alla navigazione
Vai alla ricerca
Questa pagina è una bozza!
Motivazioni[modifica | modifica wikitesto]
- Unificare la visualizzazione delle tabelle
- Spostare per quanto possibile l'impaginazione nei CSS togliendola dai dati
- Semplificare e alleggerire il codice dei template
- Migliorare l'accessibilità
- Rendere possibile la personalizzazione della visualizzazione
Elenco classi necessarie[modifica | modifica wikitesto]
- sinottico
- si applica a tutta la tabella, definisce le caratteristiche della tabella e quelle comuni a tutti gli elementi della stessa
- larghezza tabella
- bordo
- margini
- padding
- dimensioni caratteri
- float
- clear
- colore fondo
- colore carattere
- si applica a tutta la tabella, definisce le caratteristiche della tabella e quelle comuni a tutti gli elementi della stessa
- sinottico-testata
- si applica alla sola testata (va inserita due volte a livello di riga e di campo)
- centra il testo
- dimensione del carattere
- fondo grigio di default (modificabile con style="background: <colore>"; )
- si applica alla sola testata (va inserita due volte a livello di riga e di campo)
- sinottico-divisione
- si applica alle varie barre di divisione
- centra il testo
- dimensione del carattere
- fondo grigio di default (modificabile con style="background: <colore>"; )
- si applica alle varie barre di divisione
- sinottico th
- si applica a tutta la colonna delle etichette (usando la wikisintassi !)
- larghezza colonna
- allineamento testo orizzontale
- allineamento testo verticale
- si applica a tutta la colonna delle etichette (usando la wikisintassi !)
- sinottico-piede
- si applica alla ultima riga della tabella
- centra il testo
- dimensione del carattere
- fondo grigio di default (modificabile con style="background: <colore>"; )
- si applica alla ultima riga della tabella
Contenuto delle varie classi[modifica | modifica wikitesto]
.sinottico { border:1px solid #aaaaaa; background-color:#f9f9f9; padding:3px; font-size: 95%; clear:right; width:250px; float:right; margin: 0 0 1em .5em; vertical-align: top; } .sinottico th { background-color: #f2f2f2; padding: 0em 0.5em; text-align: right; vertical-align: top; } .sinottico td { padding: 0em 0.2em; vertical-align: top; } .sinottico_testata th { font-size: 120%; padding: 0em 0.5em; background-color: #dedede; text-align: center; } .sinottico_piede { text-align: center; font-size: 90%; background:#EFEFEF; } .sinottico_divisione th { color: black; font-size: 100%; padding: 0em 0.5em; background-color: #eeeeee; text-align: center; }