Definire lo stile della pagina

Per personalizzare l'aspetto grafico della pagina HTML che rappresenta il quiz, selezionare la voce "Stile del documento" dal menu Documento.

Viene visualizzata la seguente finestra:

E' possibile personalizzare:

• Sfondo pagina: immagine di sfondo, colore di sfondo e colore di primo piano, font e bordi;
• Intestazione di pagina: immagine di sfondo e logo;
• larghezza pagina: ovvero cambiare la spaziatura lato destro e sinistro della pagina;
• separatore tra domande, può essere una semplice riga orizzontale oppure una propria immagine, selezionabile da file;
• font e colori : è possibile modificare la maggior parte dei font della pagina HTML del quiz (nome famiglia del font, dimensione, colore di sfondo e di primo piano) o riportarli al valore predefinito;
• posizione delle risposte : se il testo delle risposte è una per riga o tutte sulla stessa riga

Le seguenti figure mostrano le due finestre di dialogo per cambiare lo sfondo pagina e l'intestazione pagina:

Pagina di stile

Infine, è possibile aggiungere dei propri stili CSS (Cascading Style Sheet) selezionando il secondo tab "Pagina di stile". Viene visualizzata la seguente finestra:

Per essere sicuri di aver scritto codice CSS sintatticamente corretto, premere il pulsante "Validazione"

Di seguito, un elenco di nomi di classi CSS che possono essere utilizzate per definire i propri stili:

Domande con parole omesse

	qf-gap-class
	qf-gap-input-class
	qf-gap-dropdown-select-class
	qf-gap-dropdown-option-class

Domande ad associazione di parole

	qf-matching-class
	qf-matching-left-class
	qf-matching-right-class
	qf-matching-left-selected-item-class
	qf-matching-right-selected-item-class
	qf-matching-left-dropdown-class
	qf-matching-right-dropdown-class
	qf-matching-left-item-class
	qf-matching-right-item-class

Domande aperte

	qf-openans-class

Domande a risposta vero o falso

	qf-truefalse-radio-class

Aspetto generale della pagina

	qf-panel-all-questions-class
	qf-panel-question-class
	qf-panel-question-heading-class
	qf-panel-question-body-class

	qf-panel-result-class
	qf-panel-result-heading-class
	qf-panel-result-body-class

	qf-jumbotron-class
	qf-statusbar-class
	qf-result-summary-item-class