| Naam klasse
|
Onderdeel
|
Vraagtype
|
Voorbeeld
|
Opmerking
|
| .question (Vervallen sinds 30)
|
Elk vraag blok
|
Elk vraagtype
|
<p class="question">, <ul class="question">, <table class="question">
|
| .ls-answers (Nieuw in 3.0)
|
Elk vraag blok
|
Elk vraagtype
|
<div class="ls-answers ">, <ul class="ls-answers ">, <table class="ls-answers">
|
|
| .subquestions-list
|
Lijst subvragen
|
Meerkeuzevragen, array vragen
|
<ul class="subquestions-list">, <table class="subquestions-list">
|
of .questions-list
|
| .answers-list
|
Lijst antwoorden
|
Enkelekeuze, array, Meerdere teksten
|
<ul class="answers-list">, <table class="answers-list">
|
|
| .answer-item
|
Het antwoorddeel: een antwoord
|
Enkelekeuze, array, Meerdere teksten
|
<li class="answer-item">, <td class="answer-item">
|
|
| .noanswer-item
|
Het antwoorddeel voor geen antwoord
|
Enkelekeuze, array
|
<li class="noanswer-item">, <td class="noanswer-item">
|
Geen antwoord is ook een antwoord, ze hebben 2 klassen noanswer-item en answer-item
|
| .question-item
|
Het vraagdeel: een vraag
|
Meerdere teksten, array
|
<li class="question-item">, <tr class="question-item">
|
Sommige antwoorden zijn ook vragen, dan hebben we er veel met class="question-item answer-item"
|
| .checkbox-list
|
Een lijst checkboxen
|
Meerkeuze, array getallen (checkbox)
|
<ul class="checkbox-list">, <tr class="checkbox-list">
|
Sommige vraagtypes hebben meerdere lijstenclass: zoals checkbox met opmerkingen: class="checkbox-list text-list"
|
| .checkbox-array (Nieuw in 3.0)
|
Een array van checkboxen
|
Array (getallen) met checkbox optie
|
<table class="checkbox-list">
|
|
| .checkbox-item
|
Het antwoorddeel met een checkbox
|
Meerkeuze, array getallen (checkbox)
|
<li class="checkbox-item">, <td class="checkbox-item">
|
|
| .radio-list
|
Een lijst radioknoppen
|
Enkelekeuze, array (elke regel)
|
<ul class="radio-list">, <tr class="radio-list">
|
|
| .radio-array (Nieuw in 3.0)
|
Array van radioknoppen
|
Array vraagtype
|
<table class="radio-array">
|
|
| .radio-item
|
Het antwoorddeel met een radioknop
|
Enkelekeuze, array
|
<li class="radio-item">, |
|
|
| .text-list
|
Een lijst tekstinvoer
|
Meerdere teksten, array teksten
|
<ul class="text-list">, <tr class="text-list">
|
|
| .text-item
|
Het antwoorddeel van tekstinvoer
|
Meerdere teksten, array teksten
|
<li class="text-item">, |
|
|
| .numeric-list
|
Een lijst met tekstinvoer met alleen numerieke antwoorden (elke rij)
|
Meerdere getallen, Array getallen
|
<ul class="text-list numeric-list">, <tr class="text-list numeric-list">
|
|
| .number-list
|
Een lijst met tekstinvoer met alleen numerieke antwoorden (elke rij)
|
Meerdere getallen, Array getallen
|
<ul class="text-list numeric-list">, <tr class="text-list numeric-list">
|
|
| .number-array (Nieuw in 3.0)
|
Het antwoorddeel van numerieke invoer
|
Array getallen
|
<table class="number-array">
|
|
| .select-list (Vervallen sinds 2.50)
|
Een selectie lijst
|
Array getallen, dubbele schaal
|
<table class="select-list">
|
|
| .dropdown-list (Nieuw in 2.50)
|
Een selectie lijst
|
Array getallen, Dubbele schaal (select) (elke rij)
|
<table class="dropdown-list">
|
|
| .dropdown-array (Nieuw in 3.0)
|
Een dropdownlijst
|
Array getallen, Dubbele schaal (select)
|
<table class="dropdown-array">
|
|
| .select-item (Vervallen sinds 2.50)
|
Het antwoorddeel van een selectie
|
Array getallen, dubbele schaal, enkelekeuze met selectie
|
<p class="select-item">, <td class="select-item">
|
|
| .dropdown-item (Nieuw in 2.50)
|
Het antwoorddeel van een select
|
Array getallen, Dubbele schaal (select), Enkelekeuze met select
|
<p class="dropdown-item">, <td class="dropdown-item">
|
|
| .hide (Vervallen sinds 3.0)
|
Gebruikt voor toegankelijkheid: verborgen met CSS maar gelezen met screenreader. Vanaf 2.50 : gebruik sr-only via bootstrap
|
Kort vrije tekst
|
<label class="hide">
|
Kan voor andere doelen gebruikt worden
|
| .ls-js-hidden (Nieuw in 3.0)
|
Gebruikt voor te verbergen deel als JavaScript is actief
|
Bijv. knop
|
<div class="ls-js-hidden">
|
Kan in sjabloon gebruikt worden
|
| .ls-js-hidden-sr (Nieuw in 3.0)
|
Gebruikt voor toegankelijkheid: verborgen bij JS actief, getoond bij screenreader
|
Bijv. knop
|
<a class="ls-js-hidden-sr">
|
Button
|
| .ls-no-js-hidden (Nieuw in 3.0)
|
Gebruikt voor te verbergen deel indien JS niet actief
|
Link
|
<a class="ls-no-js-hidden">
|
|
| .ls-label-xs-visibility (Nieuw in 3.0)
|
Label getoond in klein scherm (zonder extra tabel) en in screenreader
|
label
|
<label class="ls-no-js-hidden">
|
Gebruikt voor label in tabel met array vraagtype
|
| .ls-input-group-extra (Nieuw in 3.0)
|
Gebruik als bootstrap input-group-addon, maar zonder border en background.
|
right suffix
|
<div class="ls-input-group-extra">
|
Gebruik voor right en left suffix (globaal)
|
| .dontread
|
Gebruikt voor toegankelijkheid: niet te lezen met screenreader
|
Array
|
<th class="dontread">
|
|
| .checkbox (Vervallen sinds 3.0)
|
input[type=checkbox]
|
Vraag met checkbox
|
<input type="checkbox" class="checkbox">
|
Alleen voor oudere browsers nodig
|
| .radio (Vervallen sinds 3.0)
|
input[type=radio]
|
Vraag met radioknop
|
<input type="radio" class="radio">
|
Alleen voor oudere browsers nodig
|
| .text
|
input[type=text]
|
Vraag met invoertekst, of textarea
|
<textarea class="text">
|
|
| .answertext
|
Array
|
Antwoorddeel van array
|
<th class="answertext">
|
|
| .col-answers
|
Array
|
Kolom van antwoorden
|
<col class="col-answers">
|
|
| .odd .even (Vervallen sinds 3.0)
|
Array
|
Afwisseling voor kolom
|
<col class="odd">
|
|
| .array1 .array2 (Vervallen sinds 3.0)
|
Array
|
Afwisseling voor regel
|
<tr class="array1">
|
|
| .ls-odd .ls-even (Nieuw in 3.0)
|
Array
|
Afwisseling voor subvraag en Y-as
|
<tr class="ls-odd">
|
|