List
Basis
- Plan uw reis en klik op het reisadvies dat u favoriet wilt maken.
- Kies bij iPhone vervolgens voor opties (rechts boven in scherm) en kies voor ‘opslaan’ en bij Android voor het sterretje (rechts boven in scherm).
- Uw reis wordt nu opgeslagen bij ‘Mijn reizen’. Meldingen op opgeslagen reizen kunt u eenvoudig aan- en uitzetten of aanpassen.
.list
Displays an ordered list
Markup
<ul>
<li>Plan uw reis en klik op het reisadvies dat u favoriet wilt maken.</li>
<li>Kies bij iPhone vervolgens voor opties (rechts boven in scherm) en kies voor ‘opslaan’ en bij Android voor het sterretje (rechts boven in scherm).</li>
<li>Uw reis wordt nu opgeslagen bij ‘Mijn reizen’. Meldingen op opgeslagen reizen kunt u eenvoudig aan- en uitzetten of aanpassen.</li>
</ul>Examples of usage
Link list
Displays the many types of lists and how to use them.
Markup
<ul class="list">
<li class="list__item">
<a class="arrowLink {{modifier_class}}" href="javascript:void(0)">
Klantenservice Landing
</a>
</li>
<li class="list__item">
<a class="arrowLink {{modifier_class}}" href="javascript:void(0)">
Klantenservice Thema
</a>
</li>
<li class="list__item">
<a class="arrowLink {{modifier_class}}" href="javascript:void(0)">
Klantenservice Thema<br>Grote Banner Rechts
</a>
</li>
<li class="list__item">
<a class="arrowLink {{modifier_class}}" href="javascript:void(0)">
Klantenservice Detail
</a>
</li>
</ul>Ordered list
- Plan uw reis en klik op het reisadvies dat u favoriet wilt maken.
- Kies bij iPhone vervolgens voor opties (rechts boven in scherm) en kies voor ‘opslaan’ en bij Android voor het sterretje (rechts boven in scherm).
- Uw reis wordt nu opgeslagen bij ‘Mijn reizen’. Meldingen op opgeslagen reizen kunt u eenvoudig aan- en uitzetten of aanpassen.
Displays an ordered list
Markup
<ol>
<li>Plan uw reis en klik op het reisadvies dat u favoriet wilt maken.</li>
<li>Kies bij iPhone vervolgens voor opties (rechts boven in scherm) en kies voor ‘opslaan’ en bij Android voor het sterretje (rechts boven in scherm).</li>
<li>Uw reis wordt nu opgeslagen bij ‘Mijn reizen’. Meldingen op opgeslagen reizen kunt u eenvoudig aan- en uitzetten of aanpassen.</li>
</ol>Horizontal list
Horizontal version of a link list
Markup
<ul class="list list--horizontal">
<li class="list__item list__horizontalItem">
<a class="" href="javascript:void(0)">
Klantenservice Landing
</a>
</li>
<li class="list__item list__horizontalItem">
<a class="" href="javascript:void(0)">
Klantenservice Thema
</a>
</li>
<li class="list__item list__horizontalItem">
<a class="" href="javascript:void(0)">
Klantenservice Thema met Banner
</a>
</li>
<li class="list__item list__horizontalItem">
<a class="" href="javascript:void(0)">
Klantenservice Detail
</a>
</li>
</ul>List USP Alternative
- 40% korting in het weekend
- 40% korting in de daluren
The USP have an underline. The empty list items also still have an underline.
Markup
<ul class="list list--usp-alt">
<li class="list__item">
40% korting in het weekend
</li>
<li class="list__item">
40% korting in de daluren
</li>
<li class="list__item">
</li>
<li class="list__item">
</li>
</ul>