Boutons
<div class="uk-overflow-container"><a class="uk-button auto sport huge uk-float-right" rel="nofollow" target="_blank" href="/"><i class="margin-right-5 uk-icon-angle-right"></i> Votre text avec les couleur de votre choix</a></div>
<div class="uk-overflow-container"><a class="uk-button auto poker huge uk-float-right" rel="nofollow" target="_blank" href="/"><i class="margin-right-5 uk-icon-angle-right"></i> Votre text avec les couleur de votre choix</a></div>
<div class="uk-overflow-container"><a class="uk-button auto turf huge uk-float-right" rel="nofollow" target="_blank" href="/"><i class="margin-right-5 uk-icon-angle-right"></i> Votre text avec les couleur de votre choix</a></div>
<div class="uk-overflow-container"><a class="uk-button auto fdj huge uk-float-right" rel="nofollow" target="_blank" href="/"><i class="margin-right-5 uk-icon-angle-right"></i> Votre text avec les couleur de votre choix</a></div>
<div class="uk-overflow-container"><a class="uk-button auto huge uk-float-right" rel="nofollow" target="_blank" href="/"><i class="margin-right-5 uk-icon-angle-right"></i> Votre text avec les couleur de votre choix</a></div>
Les couleurs, les tailles du texte et les styles de text
Du text light
<span class="light">Du text light</span>
Le big text
<span class="big-text">DLe big text</span>
Le text thin
<span class="text-thin">Le text thin</span>
Le text gras
<span class="uk-text-bold">Le text gras</span>
du text italique
<span style="font-style: italic;">du text italique</span>
du text en uppercase
<span style="text-transform: uppercase;">du text en uppercase</span>
Du text en huge
<span class="huge-text">Du text en huge</span>
du text en bleu
<span class="text-blue">du text en bleu</span>
Du text en rouge
<span class="text-red">Du text en rouge</span>
Du text en orange
<span class="text-orange">Du text en orange</span>
Du text en vert
<span class="color-green">Du text en vert</span>
Pour vos Titre
-
Un gros titre
-
Un moins gros titre
-
Un plus petit titre
<h1>Un gros titre</h1>
<h2>Un moins gros titre</h3>
<h3>Un plus petit titre</h3>
Caption
<div class="caption">
<img src="votre lien de l'image" alt="le titre de l'image">
<div>Votre text</div>
</div>
Séparateur
Pour crée un séparateur
<hr>
Liste
- Liste 1
- Liste 2
- Liste 3
Pour crée une liste
<ul class="uk-list uk-list-line">
<li>Liste 1</li>
<li>Liste 2</li>
<li>Liste 3</li>
</ul>
Table
Table Heading | Table Heading | Table Heading |
---|---|---|
Table Footer | Table Footer | Table Footer |
Table Data | Table Data | Table Data |
Table Data | Table Data | Table Data |
Table Data | Table Data | Table Data |
<table class="uk-table">
<caption>Table Caption</caption>
<thead>
<tr>
<th>Table Heading</th>
<th>Table Heading</th>
<th>Table Heading</th>
</tr>
</thead>
<tfoot>
<tr>
<td>Table footer</td>
<td>Table footer</td>
<td>Table footer</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>Table data</td>
<td>Table data</td>
<td>Table data</td>
</tr>
<tr>
<td>Table data</td>
<td>Table data</td>
<td>Table data</td>
</tr>
<tr>
<td>Table data</td>
<td>Table data</td>
<td>Table data</td>
</tr>
</tbody>
</table>
Bloc couleur (Ref: Fiche Match)
Un titre avec une icone (couleur: sport)
Et on ajoute du text dans le bloc, on peut mettre aussi du gras et rajouter du text normal
<div class="table bloc bgColor sport img-container no-margin">
<h2>
<i class="margin-right-5-5 uk-icon-exclamation"></i>
Un titre avec une icone (couleur: sport)
</h2>
<a class="uk-text-left" href="/" target="_blank">
Et on ajoute du text dans le bloc, on peut mettre aussi du <strong>gras</strong> et rajouter du text normal
</a>
<div class="uk-overflow-container margin-top"
<a class="uk-button uk-float-right auto huge" target="_blank" href="/" style="background-color: white;color: blue;"> Je joue !</a>
</div>
</div>
Un titre avec une icone (couleur: poker)
Et on ajoute du text dans le bloc, on peut mettre aussi du gras et rajouter du text normal
<div class="table bloc bgColor poker img-container no-margin">
<h2>
<i class="margin-right-5-5 uk-icon-exclamation"></i>
Un titre avec une icone (couleur: sport)
</h2>
<a class="uk-text-left" href="/" target="_blank">
Et on ajoute du text dans le bloc, on peut mettre aussi du <strong>gras</strong> et rajouter du text normal
</a>
<div class="uk-overflow-container margin-top"
<a class="uk-button uk-float-right auto huge" target="_blank" href="/" style="background-color: white;color: blue;"> Je joue !</a>
</div>
</div>
Un titre avec une icone (couleur: turf)
Et on ajoute du text dans le bloc, on peut mettre aussi du gras et rajouter du text normal
<div class="table bloc bgColor turf img-container no-margin">
<h2>
<i class="margin-right-5-5 uk-icon-exclamation"></i>
Un titre avec une icone (couleur: sport)
</h2>
<a class="uk-text-left" href="/" target="_blank">
Et on ajoute du text dans le bloc, on peut mettre aussi du <strong>gras</strong> et rajouter du text normal
</a>
<div class="uk-overflow-container margin-top"
<a class="uk-button uk-float-right auto huge" target="_blank" href="/" style="background-color: white;color: blue;"> Je joue !</a>
</div>
</div>
Un titre avec une icone (fdj)
Et on ajoute du text dans le bloc, on peut mettre aussi du gras et rajouter du text normal
<div class="table bloc bgColor fdj img-container no-margin">
<h2>
<i class="margin-right-5-5 uk-icon-exclamation"></i>
Un titre avec une icone (couleur: sport)
</h2>
<a class="uk-text-left" href="/" target="_blank">
Et on ajoute du text dans le bloc, on peut mettre aussi du <strong>gras</strong> et rajouter du text normal
</a>
<div class="uk-overflow-container margin-top"
<a class="uk-button uk-float-right auto huge" target="_blank" href="/" style="background-color: white;color: blue;"> Je joue !</a>
</div>
</div>
Un titre avec une icone (couleur: neutre)
Et on ajoute du text dans le bloc, on peut mettre aussi du gras et rajouter du text normal
<div class="table bloc bgColor neutre img-container no-margin">
<h2>
<i class="margin-right-5-5 uk-icon-exclamation"></i>
Un titre avec une icone (couleur: sport)
</h2>
<a class="uk-text-left" href="/" target="_blank">
Et on ajoute du text dans le bloc, on peut mettre aussi du <strong>gras</strong> et rajouter du text normal
</a>
<div class="uk-overflow-container margin-top"
<a class="uk-button uk-float-right auto huge" target="_blank" href="/" style="background-color: white;color: blue;"> Je joue !</a>
</div>
</div>
Navbar (Ref: Fiche match) 7 elements
<nav class="uk-navbar special" id="autre">
<ul class="uk-navbar-nav seven">
<li><a href="#1" data-uk-smooth-scroll="{offset: 40}"><span>1</span>nav</a></li>
<li><a href="#2" data-uk-smooth-scroll="{offset: 40}"><span>2</span>nav</a></li>
<li><a href="#3" data-uk-smooth-scroll="{offset: 40}"><span>3</span>nav</a></li>
<li><a href="#4" data-uk-smooth-scroll="{offset: 40}"><span>4</span>nav</a></li>
<li><a href="#5" data-uk-smooth-scroll="{offset: 40}"><span>5</span>nav</a></li>
<li><a href="#6" data-uk-smooth-scroll="{offset: 40}"><span>6</span>nav</a></li>
<li><a href="#7" data-uk-smooth-scroll="{offset: 40}"><span>7</span>nav</a></li>
</ul>
</nav>
<nav class="uk-navbar special" id="">
<ul class="uk-navbar-nav five">
<li><a href="#1" data-uk-smooth-scroll="{offset: 40}"><span>1</span>nav</a></li>
<li><a href="#2" data-uk-smooth-scroll="{offset: 40}"><span>2</span>nav</a></li>
<li><a href="#3" data-uk-smooth-scroll="{offset: 40}"><span>3</span>nav</a></li>
<li><a href="#4" data-uk-smooth-scroll="{offset: 40}"><span>5</span>nav</a></li>
<li><a href="#5" data-uk-smooth-scroll="{offset: 40}"><span>5</span>nav</a></li>
</ul>
</nav>
<nav class="uk-navbar special" id="">
<ul class="uk-navbar-nav three">
<li><a href="#1" data-uk-smooth-scroll="{offset: 40}"><span>1</span>nav</a></li>
<li><a href="#2" data-uk-smooth-scroll="{offset: 40}"><span>2</span>nav</a></li>
<li><a href="#3" data-uk-smooth-scroll="{offset: 40}"><span>3</span>nav</a></li>
</ul>
</nav>
Navbar (Ref: Opérateur) 7 elements
<nav class="uk-navbar">
<ul class="uk-navbar-nav seven">
<li class="onglet1"><a href="/">Onglet 1</a></li>
<li class="onglet2"><a href="/">Onglet 2</a></li>
<li class="onglet3"><a href="/">Onglet 3</a></li>
<li class="onglet4"><a href="/">Onglet 4</a></li>
<li class="onglet5"><a href="/">Onglet 5</a></li>
<li class="onglet6"><a href="/">Onglet 6</a></li>
<li class="onglet7"><a href="/">Onglet 7</a></li>
</ul>
</nav>
<nav class="uk-navbar">
<ul class="uk-navbar-nav five">
<li class="onglet1"><a href="/">Onglet 1</a></li>
<li class="onglet2"><a href="/">Onglet 2</a></li>
<li class="onglet3"><a href="/">Onglet 3</a></li>
<li class="onglet4"><a href="/">Onglet 4</a></li>
<li class="onglet5"><a href="/">Onglet 5</a></li>
</ul>
</nav>
<nav class="uk-navbar">
<ul class="uk-navbar-nav three">
<li class="onglet1"><a href="/">Onglet 1</a></li>
<li class="onglet2"><a href="/">Onglet 2</a></li>
<li class="onglet3"><a href="/">Onglet 3</a></li>
</ul>
</nav>