\documentclass[10pt,a4paper]{article}

% Packages
\usepackage{fancyhdr}           % For header and footer
\usepackage{multicol}           % Allows multicols in tables
\usepackage{tabularx}           % Intelligent column widths
\usepackage{tabulary}           % Used in header and footer
\usepackage{hhline}             % Border under tables
\usepackage{graphicx}           % For images
\usepackage{xcolor}             % For hex colours
%\usepackage[utf8x]{inputenc}    % For unicode character support
\usepackage[T1]{fontenc}        % Without this we get weird character replacements
\usepackage{colortbl}           % For coloured tables
\usepackage{setspace}           % For line height
\usepackage{lastpage}           % Needed for total page number
\usepackage{seqsplit}           % Splits long words.
%\usepackage{opensans}          % Can't make this work so far. Shame. Would be lovely.
\usepackage[normalem]{ulem}     % For underlining links
% Most of the following are not required for the majority
% of cheat sheets but are needed for some symbol support.
\usepackage{amsmath}            % Symbols
\usepackage{MnSymbol}           % Symbols
\usepackage{wasysym}            % Symbols
%\usepackage[english,german,french,spanish,italian]{babel}              % Languages

% Document Info
\author{Alexandre Achain (Weizu)}
\pdfinfo{
  /Title (ressources-pour-bootstrap.pdf)
  /Creator (Cheatography)
  /Author (Alexandre Achain (Weizu))
  /Subject (Ressources pour Bootstrap Cheat Sheet)
}

% Lengths and widths
\addtolength{\textwidth}{6cm}
\addtolength{\textheight}{-1cm}
\addtolength{\hoffset}{-3cm}
\addtolength{\voffset}{-2cm}
\setlength{\tabcolsep}{0.2cm} % Space between columns
\setlength{\headsep}{-12pt} % Reduce space between header and content
\setlength{\headheight}{85pt} % If less, LaTeX automatically increases it
\renewcommand{\footrulewidth}{0pt} % Remove footer line
\renewcommand{\headrulewidth}{0pt} % Remove header line
\renewcommand{\seqinsert}{\ifmmode\allowbreak\else\-\fi} % Hyphens in seqsplit
% This two commands together give roughly
% the right line height in the tables
\renewcommand{\arraystretch}{1.3}
\onehalfspacing

% Commands
\newcommand{\SetRowColor}[1]{\noalign{\gdef\RowColorName{#1}}\rowcolor{\RowColorName}} % Shortcut for row colour
\newcommand{\mymulticolumn}[3]{\multicolumn{#1}{>{\columncolor{\RowColorName}}#2}{#3}} % For coloured multi-cols
\newcolumntype{x}[1]{>{\raggedright}p{#1}} % New column types for ragged-right paragraph columns
\newcommand{\tn}{\tabularnewline} % Required as custom column type in use

% Font and Colours
\definecolor{HeadBackground}{HTML}{333333}
\definecolor{FootBackground}{HTML}{666666}
\definecolor{TextColor}{HTML}{333333}
\definecolor{DarkBackground}{HTML}{594080}
\definecolor{LightBackground}{HTML}{F4F3F7}
\renewcommand{\familydefault}{\sfdefault}
\color{TextColor}

% Header and Footer
\pagestyle{fancy}
\fancyhead{} % Set header to blank
\fancyfoot{} % Set footer to blank
\fancyhead[L]{
\noindent
\begin{multicols}{3}
\begin{tabulary}{5.8cm}{C}
    \SetRowColor{DarkBackground}
    \vspace{-7pt}
    {\parbox{\dimexpr\textwidth-2\fboxsep\relax}{\noindent
        \hspace*{-6pt}\includegraphics[width=5.8cm]{/web/www.cheatography.com/public/images/cheatography_logo.pdf}}
    }
\end{tabulary}
\columnbreak
\begin{tabulary}{11cm}{L}
    \vspace{-2pt}\large{\bf{\textcolor{DarkBackground}{\textrm{Ressources pour Bootstrap Cheat Sheet}}}} \\
    \normalsize{by \textcolor{DarkBackground}{Alexandre Achain (Weizu)} via \textcolor{DarkBackground}{\uline{cheatography.com/5452/cs/3339/}}}
\end{tabulary}
\end{multicols}}

\fancyfoot[L]{ \footnotesize
\noindent
\begin{multicols}{3}
\begin{tabulary}{5.8cm}{LL}
  \SetRowColor{FootBackground}
  \mymulticolumn{2}{p{5.377cm}}{\bf\textcolor{white}{Cheatographer}}  \\
  \vspace{-2pt}Alexandre Achain (Weizu) \\
  \uline{cheatography.com/weizu} \\
        \uline{\seqsplit{alexandre}.achain.chez.com/}
  \end{tabulary}
\vfill
\columnbreak
\begin{tabulary}{5.8cm}{L}
  \SetRowColor{FootBackground}
  \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Cheat Sheet}}  \\
   \vspace{-2pt}Published 21st June, 2015.\\
   Updated 17th November, 2016.\\
   Page {\thepage} of \pageref{LastPage}.
\end{tabulary}
\vfill
\columnbreak
\begin{tabulary}{5.8cm}{L}
  \SetRowColor{FootBackground}
  \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Sponsor}}  \\
  \SetRowColor{white}
  \vspace{-5pt}
  %\includegraphics[width=48px,height=48px]{dave.jpeg}
  Measure your website readability!\\
  www.readability-score.com
\end{tabulary}
\end{multicols}}




\begin{document}
\raggedright
\raggedcolumns

% Set font size to small. Switch to any value
% from this page to resize cheat sheet text:
% www.emerson.emory.edu/services/latex/latex_169.html
\footnotesize % Small font.

\begin{multicols*}{2}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Structure d'une page HTML avec Bootstrap}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\textless{}!DOCTYPE html\textgreater{} \newline \textless{}html lang="en"\textgreater{} \newline   \textless{}head\textgreater{} \newline     \textless{}meta charset="utf-8"\textgreater{} \newline     \textless{}meta \seqsplit{http-equiv="X-UA-Compatible"} content="IE=edge"\textgreater{} \newline     \textless{}meta name="viewport" \seqsplit{content="width=device-width}, initial-scale=1"\textgreater{} \newline     \textless{}link rel="stylesheet" \seqsplit{href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min}.css"\textgreater{} \newline     \textless{}link rel="stylesheet" \seqsplit{href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min}.css"\textgreater{} \newline     \textless{}title\textgreater{}Bootstrap Page\textless{}/title\textgreater{} \newline   \textless{}/head\textgreater{} \newline   \textless{}body\textgreater{} \newline     \textless{}div class="container"\textgreater{} \textless{}!-{}- ou class="container-fluid" -{}-\textgreater{} \newline       \textless{}div class="row"\textgreater{} \newline         ////// Colonnes de la page \newline       \textless{}/div\textgreater{} \newline     \textless{}/div\textgreater{} \newline     \textless{}script \seqsplit{src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min}.js"\textgreater{}\textless{}/script\textgreater{} \newline     \textless{}script \seqsplit{src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min}.js"\textgreater{}\textless{}/script\textgreater{} \newline   \textless{}/body\textgreater{} \newline \textless{}/html\textgreater{}} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2.66 cm} x{2.356 cm} x{2.584 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Gestion des colonnes}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Classe de la colonne}} & {\bf{Taille de l'écran}} & {\bf{Largeur du container}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
.col-xs-\# & \textgreater{}0 & auto \tn 
% Row Count 3 (+ 1)
% Row 2
\SetRowColor{LightBackground}
.col-sm-\# & \textgreater{}768px & 750px \tn 
% Row Count 4 (+ 1)
% Row 3
\SetRowColor{white}
.col-md-\# & \textgreater{}992px & 970px \tn 
% Row Count 5 (+ 1)
% Row 4
\SetRowColor{LightBackground}
.col-lg-\# & \textgreater{}1200px & 1170px \tn 
% Row Count 6 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{Le \# est à remplacer par un nombre entre 1 et 12. Ces classes s'appliquent sur des \textless{}div\textgreater{} et doivent être incluses dans des \textless{}div\textgreater{} avec la class "row", eux-même contenus dans un \textless{}div\textgreater{} avec la class "container" ou "container-fluid".}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2.432 cm} x{2.584 cm} x{2.584 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Gestion des colonnes - Offsets \& Décalages}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Classes d'offset}} & {\bf{Classes de Push}} & {\bf{Classes de Pull}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
{\emph{Marge à gauche}} & {\emph{Décalage à droite}} & {\emph{Décalage à gauche}} \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{.col-sm-offset-\#} & \seqsplit{.col-sm-push-\#} & \seqsplit{.col-sm-pull-\#} \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
\seqsplit{.col-md-offset-\#} & \seqsplit{.col-md-push-\#} & \seqsplit{.col-md-pull-\#} \tn 
% Row Count 8 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{.col-lg-offset-\#} & \seqsplit{.col-lg-push-\#} & \seqsplit{.col-lg-pull-\#} \tn 
% Row Count 10 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.8 cm} x{2.088 cm} x{1.8 cm} x{1.512 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{4}{x{8.4cm}}{\bf\textcolor{white}{Classes de Visibilités}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Ecran}} & {\bf{Taille de l'écran}} & {\bf{Affichage}} & {\bf{Cache}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
{\emph{Smartphones}} & \textless{}767px & \seqsplit{.visible-xs} & \seqsplit{.hidden-xs} \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
{\emph{Tablettes}} & \textgreater{}768px \& \textless{}991px & \seqsplit{.visible-sm} & \seqsplit{.hidden-sm} \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
{\emph{PC de Bureau}} & \textgreater{}992px \& \textless{}1199px & \seqsplit{.visible-md} & \seqsplit{.hidden-md} \tn 
% Row Count 8 (+ 2)
% Row 4
\SetRowColor{LightBackground}
{\emph{Ecrans Larges}} & \textgreater{}1200px & \seqsplit{.visible-lg} & \seqsplit{.hidden-lg} \tn 
% Row Count 10 (+ 2)
% Row 5
\SetRowColor{white}
{\emph{Impression}} &  & \seqsplit{.visible-print} & \seqsplit{.hidden-print} \tn 
% Row Count 12 (+ 2)
% Row 6
\SetRowColor{LightBackground}
{\emph{Lecteur d'écran}} &  & sr-only &  \tn 
% Row Count 14 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}----}
\SetRowColor{LightBackground}
\mymulticolumn{4}{x{8.4cm}}{Les classes d'affichage (.visible-{\emph{) n'affichent que pour la taille indiquée. \newline Les classes pour cacher (.hidden-}}) affichent sur les autres tailles que celle indiquée. \newline La classe {\emph{sr-only}} peut être combinée avec {\emph{sr-only-focusable}} pour que l'élément ne s'affiche que lorqu'il est en état {\bf{focus}}}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}----}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.9 cm} x{4.864 cm} p{0.836 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Classes Helpers}}  \tn
% Row 0
\SetRowColor{LightBackground}
.clearfix & Clearfix (reset les floats) & block \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\seqsplit{.pull-left} & Force un float à gauche & block \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{.pull-right} & Force un float à droite & block \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
\seqsplit{.center-block} & Centre l'objet HTML comme un block & {\emph{tous}} \tn 
% Row Count 8 (+ 2)
% Row 4
\SetRowColor{LightBackground}
.show & Force l'affichage & block \tn 
% Row Count 10 (+ 2)
% Row 5
\SetRowColor{white}
.hidden & Force la dissimulation & block \tn 
% Row Count 12 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{.invisible} & Rend invisible & {\emph{tous}} \tn 
% Row Count 14 (+ 2)
% Row 7
\SetRowColor{white}
.badge & Badge aligné à droite & \textless{}span\textgreater{} \tn 
% Row Count 16 (+ 2)
% Row 8
\SetRowColor{LightBackground}
\seqsplit{.initialism} & Diminue la taille de police & \textless{}abbr\textgreater{} \tn 
% Row Count 18 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{block, inline et inline-block désignent le type d'affichage de l'élément (display css).}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{CSS \& HTML Secondaire}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{} \tn 
% Row Count 0 (+ 0)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2.4 cm} x{5.6 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Textes \& Paragraphes \textless{}p\textgreater{} \textless{}span\textgreater{}}}  \tn
% Row 0
\SetRowColor{LightBackground}
.text-{\emph{context}} & Couleur contextuelle \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\mymulticolumn{2}{x{8.4cm}}{({\emph{context}}* = primary, success, info, warning ou danger)} \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
.text-{\emph{alig}} & Alignement \tn 
% Row Count 5 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{2}{x{8.4cm}}{({\emph{alig}} = left, center, right, justify ou nowrap)} \tn 
% Row Count 6 (+ 1)
% Row 4
\SetRowColor{LightBackground}
.text-{\emph{transform}} & Transformation de caractère \tn 
% Row Count 8 (+ 2)
% Row 5
\SetRowColor{white}
\mymulticolumn{2}{x{8.4cm}}{({\emph{transform}} = lowercase, uppercase ou capitalize)} \tn 
% Row Count 10 (+ 2)
% Row 6
\SetRowColor{LightBackground}
.text-hide & Cacher le texte \tn 
% Row Count 11 (+ 1)
% Row 7
\SetRowColor{white}
\mymulticolumn{2}{x{8.4cm}}{(utile pour remplacer un titre par une image)} \tn 
% Row Count 12 (+ 1)
% Row 8
\SetRowColor{LightBackground}
.bg-{\emph{context}} & Couleur de fond contextuelle \tn 
% Row Count 14 (+ 2)
% Row 9
\SetRowColor{white}
\mymulticolumn{2}{x{8.4cm}}{({\emph{context}} = muted, primary, success, info, warning, danger)} \tn 
% Row Count 16 (+ 2)
% Row 10
\SetRowColor{LightBackground}
.h\# & Même apparence qu'un titre (\# = 1 à 6) \tn 
% Row Count 18 (+ 2)
% Row 11
\SetRowColor{white}
.small & Même apparence que \textless{}small\textgreater{} \tn 
% Row Count 19 (+ 1)
% Row 12
\SetRowColor{LightBackground}
.lead & Paragraphe principal \tn 
% Row Count 20 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{3.6 cm} x{4.4 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Images \textless{}img\textgreater{}}}  \tn
% Row 0
\SetRowColor{LightBackground}
.img-responsive & Image Responsive \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
.img-rounded & Bords arrondis \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
.img-circle & Bordure circulaire \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
.img-thumbnail & Double Bord \tn 
% Row Count 4 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2.4 cm} x{5.6 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Tableaux \textless{}table\textgreater{}}}  \tn
% Row 0
\SetRowColor{LightBackground}
.table & Style de base (obl.) \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\seqsplit{.table-striped} & Couleurs alternées \tn 
% Row Count 3 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{.table-bordered} & Bordure \tn 
% Row Count 5 (+ 2)
% Row 3
\SetRowColor{white}
\seqsplit{.table-hover} & Couleur de la ligne active \tn 
% Row Count 6 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{.table-condensed} & Petites lignes \tn 
% Row Count 8 (+ 2)
% Row 5
\SetRowColor{white}
\seqsplit{.table-responsive} & Scroll horizontal pour un écran \textless{}768px \tn 
% Row Count 10 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{La classe .table est nécessaire pour utiliser l'une des autres classes.}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2.28 cm} x{2.66 cm} x{2.66 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Contexte de colonnes ou lignes \textless{}tr\textgreater{} \textless{}td\textgreater{} \textless{}th\textgreater{}}}  \tn
% Row 0
\SetRowColor{LightBackground}
.active & .success & .warning \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
.info & .danger &  \tn 
% Row Count 2 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{Ces classes, appliquées sur une ligne ou une cellule, permettent de changer la couleur de fond de celle-ci afin de correspondre à un contexte donné. \newline La couleur de fond pour la classe active est la même que la couleur de la ligne survolé avec la classe .table-hovered sur le tableau.}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2.204 cm} x{4.636 cm} p{0.76 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Listes}}  \tn
% Row 0
\SetRowColor{LightBackground}
\seqsplit{.list-unstyled} & Liste sans puces & \textless{}ul\textgreater{} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\seqsplit{.list-inline} & Liste en ligne & \textless{}ul\textgreater{} \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{.dl-horizontal} & Affichage de liste de définitions en tableau & \textless{}dl\textgreater{} \tn 
% Row Count 6 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.9 cm} x{2.888 cm} x{2.812 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Formulaires}}  \tn
% Row 0
\SetRowColor{LightBackground}
\seqsplit{.form-inline} & Formulaire sur une ligne & \textless{}form\textgreater{} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\seqsplit{.form-horizontal} & Formulaire avec le \textless{}label\textgreater{} et le \textless{}input\textgreater{} sur une ligne & \textless{}form\textgreater{} \tn 
% Row Count 6 (+ 4)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{.form-control} & Style de base (obl.) & textual \textless{}input\textgreater{}, \textless{}textarea\textgreater{} \& \textless{}select\textgreater{} \tn 
% Row Count 9 (+ 3)
% Row 3
\SetRowColor{white}
.input-{\emph{taille}} & Taille de l'input & textual \textless{}input\textgreater{}, \textless{}textarea\textgreater{} \& \textless{}select\textgreater{} \tn 
% Row Count 12 (+ 3)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{\textless{}*taille : sm ou lg)} \tn 
% Row Count 13 (+ 1)
% Row 5
\SetRowColor{white}
\seqsplit{.form-group} & Style de base (obl.) pour le \textless{}div\textgreater{} incluant le \textless{}label\textgreater{} et son \textless{}input\textgreater{} & \textless{}div\textgreater{} \tn 
% Row Count 18 (+ 5)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{.form-group} .has-{\emph{context}} & Contexte de résultat & \textless{}div\textgreater{} \tn 
% Row Count 21 (+ 3)
% Row 7
\SetRowColor{white}
\mymulticolumn{3}{x{8.4cm}}{({\emph{context}} : success, warning, error)} \tn 
% Row Count 22 (+ 1)
% Row 8
\SetRowColor{LightBackground}
.checkbox & Sous-groupe pour les checkbox & \textless{}div\textgreater{} \tn 
% Row Count 24 (+ 2)
% Row 9
\SetRowColor{white}
\seqsplit{.checkbox-inline} &  & \textless{}div\textgreater{} \tn 
% Row Count 26 (+ 2)
% Row 10
\SetRowColor{LightBackground}
.radio & Sous-groupe pour les radio controls & \textless{}div\textgreater{} \tn 
% Row Count 29 (+ 3)
% Row 11
\SetRowColor{white}
\seqsplit{.radio-inline} &  & \textless{}div\textgreater{} \tn 
% Row Count 31 (+ 2)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{1.9 cm} x{2.888 cm} x{2.812 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Formulaires (cont)}}  \tn
% Row 12
\SetRowColor{LightBackground}
\seqsplit{.input-group} & Permet accoler des div à un \textless{}input\textgreater{} pour donner des indications & \textless{}div\textgreater{} \tn 
% Row Count 5 (+ 5)
% Row 13
\SetRowColor{white}
\seqsplit{.input-group-addon} & Blocks accolés à l'input & \textless{}div\textgreater{} \tn 
% Row Count 7 (+ 2)
% Row 14
\SetRowColor{LightBackground}
\seqsplit{.form-control-static} & Valeurs fixes & \textless{}p\textgreater{} \tn 
% Row Count 9 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{3.92 cm} x{4.08 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Liste des composants}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Composant}} & {\bf{Classe Principale}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
Menus droulants & .dropdown (\& .dropdown-toggle \& ul.dropdown-menu) \tn 
% Row Count 5 (+ 3)
% Row 2
\SetRowColor{LightBackground}
Boutons accollés \& Boutons déroulants & .btn-group \tn 
% Row Count 8 (+ 3)
% Row 3
\SetRowColor{white}
Barre de navigation & .nav \tn 
% Row Count 9 (+ 1)
% Row 4
\SetRowColor{LightBackground}
Barre de navigation principale & .navbar \tn 
% Row Count 11 (+ 2)
% Row 5
\SetRowColor{white}
Fil d'Ariane & .breadcrumb \tn 
% Row Count 12 (+ 1)
% Row 6
\SetRowColor{LightBackground}
Pagination & ul.pagination \tn 
% Row Count 13 (+ 1)
% Row 7
\SetRowColor{white}
Labels & .label.label-* (* : contect) \tn 
% Row Count 15 (+ 2)
% Row 8
\SetRowColor{LightBackground}
Badges & span.badge \tn 
% Row Count 16 (+ 1)
% Row 9
\SetRowColor{white}
\mymulticolumn{2}{x{8.4cm}}{A utiliser au sein d'un lien ou d'un bouton} \tn 
% Row Count 17 (+ 1)
% Row 10
\SetRowColor{LightBackground}
Jumbotron & .jumbotron \tn 
% Row Count 18 (+ 1)
% Row 11
\SetRowColor{white}
Entête de page & .page-header \tn 
% Row Count 19 (+ 1)
% Row 12
\SetRowColor{LightBackground}
Vignettes automatiques & a.thumnails \tn 
% Row Count 21 (+ 2)
% Row 13
\SetRowColor{white}
\mymulticolumn{2}{x{8.4cm}}{Code : \textless{}a href="\#" class="thumbnail"\textgreater{}       \textless{}img src="..." alt="..."\textgreater{}     \textless{}/a\textgreater{}} \tn 
% Row Count 23 (+ 2)
% Row 14
\SetRowColor{LightBackground}
Messages d'alerte & .alert .alert-{\emph{context}} ({\emph{context}} : type de message) \tn 
% Row Count 26 (+ 3)
% Row 15
\SetRowColor{white}
Objets Media & .media \tn 
% Row Count 27 (+ 1)
% Row 16
\SetRowColor{LightBackground}
Listes en groupe (accolés) & .list-group \tn 
% Row Count 29 (+ 2)
% Row 17
\SetRowColor{white}
Panneaux & .panel \tn 
% Row Count 30 (+ 1)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{3.92 cm} x{4.08 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Liste des composants (cont)}}  \tn
% Row 18
\SetRowColor{LightBackground}
Code embarqué responsive & \seqsplit{.embed-responsive-item} \tn 
% Row Count 2 (+ 2)
% Row 19
\SetRowColor{white}
Cadre incrusté & .well \tn 
% Row Count 3 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2.08 cm} x{5.92 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Boutons}}  \tn
% Row 0
\SetRowColor{LightBackground}
.btn & Classe de base (obl.) \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
.btn-{\emph{context}} & Contexte \tn 
% Row Count 3 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{({\emph{context}} = default, success, warning, primary, info, danger)} \tn 
% Row Count 5 (+ 2)
% Row 3
\SetRowColor{white}
.btn-{\emph{taille}} & Taille du bouton ({\emph{taille}} = xs, sm, lg) \tn 
% Row Count 7 (+ 2)
% Row 4
\SetRowColor{LightBackground}
btn-block & Affiche le bouton sur toute la largeur \tn 
% Row Count 9 (+ 2)
% Row 5
\SetRowColor{white}
.btn-link & Apparrence de lien \tn 
% Row Count 10 (+ 1)
% Row 6
\SetRowColor{LightBackground}
.active & A tag - état enfoncé \tn 
% Row Count 11 (+ 1)
% Row 7
\SetRowColor{white}
.disabled & A tag - état désactivé \tn 
% Row Count 12 (+ 1)
% Row 8
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{(bouton \& input : ajouter disabled="disabled")} \tn 
% Row Count 13 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{S'applique aux balises suivantes : \newline \textless{}button\textgreater{} \newline \textless{}a\textgreater{} \newline \textless{}input type='submit'\textgreater{} \newline \textless{}input type='button'\textgreater{}}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{p{0.76 cm} p{0.76 cm} p{0.76 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Navbar}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{.navbar} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\mymulticolumn{3}{x{8.4cm}}{.navbar\_brand} \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{.navbar-collapse} \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{3}{x{8.4cm}}{.navbar-toggle} \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{.navbar-btn} \tn 
% Row Count 5 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{4.56 cm} p{0.76 cm} p{2.28 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Labels \textless{}span\textgreater{}}}  \tn
% Row 0
\SetRowColor{LightBackground}
.label &  & \textless{}span\textgreater{} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
.label-default &  & \textless{}span\textgreater{} \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
.label-primary &  & \textless{}span\textgreater{} \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
.label-success &  & \textless{}span\textgreater{} \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
.label-info &  & \textless{}span\textgreater{} \tn 
% Row Count 5 (+ 1)
% Row 5
\SetRowColor{white}
.label-warning &  & \textless{}span\textgreater{} \tn 
% Row Count 6 (+ 1)
% Row 6
\SetRowColor{LightBackground}
.label-danger &  & \textless{}span\textgreater{} \tn 
% Row Count 7 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{4.24 cm} x{3.76 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Messages d'alerte}}  \tn
% Row 0
\SetRowColor{LightBackground}
.alert & Classe de base (obl.) \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
.alert-{\emph{context}} & Couleur contextuelle \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{({\emph{context}} = default, success, info, warning, danger)} \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
.alert-dismissable & Message refermable \tn 
% Row Count 8 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{\textless{}button type="button" class="close" data-dismiss="alert" aria-hidden="true"\textgreater{}\×\textless{}/button\textgreater{}} \tn 
% Row Count 11 (+ 3)
% Row 5
\SetRowColor{white}
\mymulticolumn{2}{x{8.4cm}}{\textless{}button type="button" class="close" aria-label="Close"\textgreater{}\textless{}span aria-hidden="true"\textgreater{}\×\textless{}/span\textgreater{}\textless{}/button\textgreater{}} \tn 
% Row Count 14 (+ 3)
% Row 6
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{\textless{}a href="\#" class="alert-link"\textgreater{}...\textless{}/a\textgreater{}} \tn 
% Row Count 16 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{p{0.76 cm} p{0.76 cm} p{0.76 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Panels}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{.panel-group} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\mymulticolumn{3}{x{8.4cm}}{.panel .panel-default} \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{.panel-heading} \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{3}{x{8.4cm}}{.panel-collapse} \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{.panel-body} \tn 
% Row Count 5 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Exemples Codes HTML}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Addresses}}} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}address\textgreater{} \textless{}strong\textgreater{}Twitter, Inc.\textless{}/strong\textgreater{}\textless{}br\textgreater{} 795 Folsom Ave, Suite 600\textless{}br\textgreater{} San Francisco, CA 94107\textless{}br\textgreater{} \textless{}abbr title="Phone"\textgreater{}P:\textless{}/abbr\textgreater{} (123) 456-7890 \textless{}/address\textgreater{}} \tn 
% Row Count 6 (+ 6)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Glyphicons}} ({\emph{\#\#}} : icône)} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}span class="glyphicon glyphicon-{\emph{\#\#}}"\textgreater{}\textless{}/span\textgreater{}} \tn 
% Row Count 9 (+ 3)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Flèche de liste déroulante}}} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}span class="caret"\textgreater{}\textless{}/span\textgreater{}} \tn 
% Row Count 11 (+ 2)
% Row 3
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Abbréviations}}} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}abbr title="attribute"\textgreater{}attr\textless{}/abbr\textgreater{}} \tn 
% Row Count 14 (+ 3)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Texte surligné}}} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}mark\textgreater{}highlight\textless{}/mark\textgreater{}} \tn 
% Row Count 16 (+ 2)
% Row 5
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Texte effacé}} (barré)} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}del\textgreater{}deleted text\textless{}/del\textgreater{}} \tn 
% Row Count 18 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Texte barré}}} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}s\textgreater{}stricked text\textless{}/s\textgreater{}} \tn 
% Row Count 20 (+ 2)
% Row 7
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Texte inséré}} (souligné)} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}ins\textgreater{}added text\textless{}/ins\textgreater{}} \tn 
% Row Count 22 (+ 2)
% Row 8
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Texte souligné}}} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}u\textgreater{}underlined text\textless{}/u\textgreater{}} \tn 
% Row Count 24 (+ 2)
% Row 9
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Texte plus petit}}} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}small\textgreater{}small text\textless{}/small\textgreater{}} \tn 
% Row Count 26 (+ 2)
% Row 10
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Texte gras}}} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}strong\textgreater{}bold text\textless{}/strong\textgreater{}} \tn 
% Row Count 28 (+ 2)
% Row 11
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Texte italique}}} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}em\textgreater{}italicized text\textless{}/em\textgreater{}} \tn 
% Row Count 30 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{\textless{}blockquote\textgreater{}}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Format de Base}}} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}blockquote\textgreater{} \textless{}p\textgreater{}Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer\textless{}/p\textgreater{} \textless{}/blockquote\textgreater{}} \tn 
% Row Count 4 (+ 4)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Format étendu}}} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}blockquote\textgreater{}   \textless{}p\textgreater{}Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.\textless{}/p\textgreater{}   \textless{}footer\textgreater{}Someone famous in \textless{}cite title="Source Title"\textgreater{}Source Title\textless{}/cite\textgreater{}\textless{}/footer\textgreater{} \textless{}/blockquote\textgreater{}} \tn 
% Row Count 10 (+ 6)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{{\bf{Alignement à droite}} (classe)} \tn 
\mymulticolumn{1}{x{8.4cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}.blockquote-reverse} \tn 
% Row Count 12 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{3.8 cm} x{2.964 cm} p{0.836 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Affichage de code}}  \tn
% Row 0
\SetRowColor{LightBackground}
\textless{}code\textgreater{} & fragments de code & \seqsplit{inline} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\textless{}kbd\textgreater{} & affichage d'une touche & \seqsplit{inline} \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\textless{}pre\textgreater{} & Code & block \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
\textless{}pre class="pre-scrollable"\textgreater{} & Code & block \tn 
% Row Count 8 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{(avec scroll vertical pour une hauteur \textgreater{}350px)} \tn 
% Row Count 9 (+ 1)
% Row 5
\SetRowColor{white}
\textless{}var\textgreater{} & Variables & \seqsplit{inline} \tn 
% Row Count 11 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\textless{}samp\textgreater{} & Sortie de terminal & block \tn 
% Row Count 13 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Liens}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{} \tn 
% Row Count 0 (+ 0)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Eléments requis}}  \tn
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{Le Framework Bootstrap est basé sur les derniers langages du Web : {\bf{HTML 5 \& CSS 3}} et nécessite {\bf{jQuery}} pour fonctionner.% Row Count 3 (+ 3)
} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{3.04 cm} x{4.96 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Editeurs de Thèmes Bootstrap}}  \tn
% Row 0
\SetRowColor{LightBackground}
Bootstrap Magic & \seqsplit{http://pikock.github.io/bootstrap-magic/app/\#}!/editor \tn 
% Row Count 3 (+ 3)
% Row 1
\SetRowColor{white}
Lavish Bootstrap & \seqsplit{http://www.lavishbootstrap.com/} \tn 
% Row Count 5 (+ 2)
% Row 2
\SetRowColor{LightBackground}
Boot Theme & \seqsplit{https://www.boottheme.com/} \tn 
% Row Count 7 (+ 2)
% Row 3
\SetRowColor{white}
Bootstrap Designer & \seqsplit{http://www.bootstrapdesigner.com/} \tn 
% Row Count 9 (+ 2)
% Row 4
\SetRowColor{LightBackground}
PaintStrap & http://paintstrap.com/ \tn 
% Row Count 10 (+ 1)
% Row 5
\SetRowColor{white}
JQuery UI Bootstrap Theme & \seqsplit{https://github.com/commadelimited/jQuery-Mobile-Bootstrap-Theme} \tn 
% Row Count 13 (+ 3)
% Row 6
\SetRowColor{LightBackground}
Bootstrap Hero (\$) & \seqsplit{http://bootstraphero.com/} \tn 
% Row Count 15 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{Les éditeurs payants sont marqués d'un  (\$)}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Ressources de Développement}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{Bootstrap en Français : \seqsplit{http://www.oneskyapp.com/fr/docs/bootstrap/getting-started/}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{http://getbootstrap.com/} \tn 
% Row Count 3 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\seqsplit{https://github.com/twbs/bootlint}} \tn 
% Row Count 4 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{http://bootsnipp.com/} \tn 
% Row Count 5 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\seqsplit{http://fontawesome.bootstrapcheatsheets.com/}} \tn 
% Row Count 6 (+ 1)
% Row 5
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\seqsplit{http://glyphicons.bootstrapcheatsheets.com/}} \tn 
% Row Count 7 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Thèmes Gratuits}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{http://bootswatch.com/} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\seqsplit{http://startbootstrap.com/}} \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\seqsplit{http://www.goldbootstrap.com/}} \tn 
% Row Count 3 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Thèmes Payants - Places de Marchés}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\seqsplit{https://wrapbootstrap.com/}} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{https://twittstrap.com/} \tn 
% Row Count 2 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Forks de Bootstrap 2}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\seqsplit{https://github.com/danneu/darkstrap}} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\seqsplit{https://github.com/phildionne/golden-bootstrap/}} \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\seqsplit{https://github.com/aozora/bootmetro}} \tn 
% Row Count 3 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Licence}}  \tn
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{Bootstrap is released under the MIT license and is copyright 2015 Twitter. \newline % Row Count 2 (+ 2)
Plus d'info : \seqsplit{http://getbootstrap.com/getting-started/\#license-faqs}% Row Count 4 (+ 2)
} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}


% That's all folks
\end{multicols*}

\end{document}