\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{Mr P.}
\pdfinfo{
  /Title (php.pdf)
  /Creator (Cheatography)
  /Author (Mr P.)
  /Subject (PHP 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}{3C3C3C}
\definecolor{LightBackground}{HTML}{F8F8F8}
\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{PHP Cheat Sheet}}}} \\
    \normalsize{by \textcolor{DarkBackground}{Mr P.} via \textcolor{DarkBackground}{\uline{cheatography.com/173036/cs/36354/}}}
\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}Mr P. \\
  \uline{cheatography.com/mr-p} \\
  \end{tabulary}
\vfill
\columnbreak
\begin{tabulary}{5.8cm}{L}
  \SetRowColor{FootBackground}
  \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Cheat Sheet}}  \\
   \vspace{-2pt}Not Yet Published.\\
   Updated 7th April, 2023.\\
   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}{HTML 5}}  \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}{PHP}}  \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}{CSS 3}}  \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{3.76 cm} x{4.24 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{HTML5 Structure}}  \tn
% Row 0
\SetRowColor{LightBackground}
\textless{}!DOCTYPE html\textgreater{} & Page web HTML \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\textless{}html\textgreater{}\textless{}/html\textgreater{} & Balise principale \tn 
% Row Count 3 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\textless{}head\textgreater{}\textless{}/head\textgreater{} & En-tête de la page \tn 
% Row Count 5 (+ 2)
% Row 3
\SetRowColor{white}
\textless{}meta charset="utf-8"\textgreater{} & Encodage (se place dans \textless{}head\textgreater{}) \tn 
% Row Count 7 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\textless{}body\textgreater{}\textless{}/body\textgreater{} & Corps de la page \tn 
% Row Count 9 (+ 2)
% Row 5
\SetRowColor{white}
\textless{}!-{}- Commentaire -{}-\textgreater{} & Commentaire \tn 
% Row Count 11 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.6 cm} x{6.4 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Balises d'en-tête}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\textless{}link\textgreater{} & Liaison avec une feuille de style (balise orpheline). \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\textless{}meta\textgreater{} & Métadonnées de la page web (balise orpheline). \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
\textless{}script\textgreater{} & Code JavaScript \tn 
% Row Count 7 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\textless{}style\textgreater{} & Code CSS \tn 
% Row Count 8 (+ 1)
% Row 5
\SetRowColor{white}
\textless{}title\textgreater{} & Titre de la page \tn 
% Row Count 9 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{Ces balises sont toutes situées entre \textless{}head\textgreater{} et \textless{}/head\textgreater{}}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2 cm} x{6 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Balises sectionnantes}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Description}} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\textless{}header\textgreater{} & En-tête \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\textless{}nav\textgreater{} & Liens principaux de navigation \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\textless{}footer\textgreater{} & Pied de page \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\textless{}section\textgreater{} & Section de page \tn 
% Row Count 5 (+ 1)
% Row 5
\SetRowColor{white}
\textless{}article\textgreater{} & Article (contenu autonome) \tn 
% Row Count 6 (+ 1)
% Row 6
\SetRowColor{LightBackground}
\textless{}aside\textgreater{} & Informations complémentaires \tn 
% Row Count 7 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.84 cm} x{6.16 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Balises génériques (ou universelles)}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\textless{}span\textgreater{} & Balise générique de type inline \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\textless{}div\textgreater{} & Balise générique de type block \tn 
% Row Count 6 (+ 2)
\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}{Balises de listes}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Description}} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\textless{}ul\textgreater{}\textless{}/ul\textgreater{} & Liste à puces, non numérotée \tn 
% Row Count 3 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\textless{}ol\textgreater{}\textless{}/ol\textgreater{} & Liste numérotée \tn 
% Row Count 5 (+ 2)
% Row 3
\SetRowColor{white}
\textless{}li\textgreater{}\textless{}/li\textgreater{} & Élément de la liste à puces \tn 
% Row Count 7 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\textless{}dl\textgreater{} & Liste de définitions \tn 
% Row Count 8 (+ 1)
% Row 5
\SetRowColor{white}
\textless{}dt\textgreater{} & Terme à définir \tn 
% Row Count 9 (+ 1)
% Row 6
\SetRowColor{LightBackground}
\textless{}dd\textgreater{} & Définition du terme \tn 
% Row Count 10 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.92 cm} x{6.08 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Balises de tableau}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\textless{}table\textgreater{} & Tableau \tn 
% Row Count 3 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\textless{}caption\textgreater{} & Titre du tableau \tn 
% Row Count 4 (+ 1)
% Row 3
\SetRowColor{white}
\textless{}tr\textgreater{} & Ligne de tableau \tn 
% Row Count 5 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\textless{}th\textgreater{} & Cellule d'en-tête \tn 
% Row Count 6 (+ 1)
% Row 5
\SetRowColor{white}
\textless{}td\textgreater{} & Cellule \tn 
% Row Count 7 (+ 1)
% Row 6
\SetRowColor{LightBackground}
\textless{}thead\textgreater{} & Section de l'en-tête du tableau \tn 
% Row Count 9 (+ 2)
% Row 7
\SetRowColor{white}
\textless{}tbody\textgreater{} & Section du corps du tableau \tn 
% Row Count 10 (+ 1)
% Row 8
\SetRowColor{LightBackground}
\textless{}tfoot\textgreater{} & Section du pied du tableau \tn 
% Row Count 11 (+ 1)
% Row 9
\SetRowColor{white}
colspan & Fusionne des colonnes \tn 
% Row Count 12 (+ 1)
% Row 10
\SetRowColor{LightBackground}
rowspan & Fusionne des lignes \tn 
% Row Count 13 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.6 cm} x{6.4 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Balises de formulaire}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\textless{}form\textgreater{} & Formulaire \tn 
% Row Count 3 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\textless{}fieldset\textgreater{} & Groupe de champs \tn 
% Row Count 5 (+ 2)
% Row 3
\SetRowColor{white}
\textless{}legend\textgreater{} & Titre d'un groupe de champs \tn 
% Row Count 6 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\textless{}label\textgreater{} & Libellé d'un champ \tn 
% Row Count 7 (+ 1)
% Row 5
\SetRowColor{white}
\textless{}input\textgreater{} & Champ de formulaire (balise orpheline) \tn 
% Row Count 9 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\textless{}textarea\textgreater{} & Zone de saisie multiligne \tn 
% Row Count 11 (+ 2)
% Row 7
\SetRowColor{white}
\textless{}select\textgreater{} & Liste déroulante \tn 
% Row Count 12 (+ 1)
% Row 8
\SetRowColor{LightBackground}
\textless{}option\textgreater{} & Élément d'une liste déroulante \tn 
% Row Count 14 (+ 2)
% Row 9
\SetRowColor{white}
\textless{}optgroup\textgreater{} & Groupe d'éléments d'une liste déroulante \tn 
% Row Count 16 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.748 cm} x{2.052 cm} x{3.8 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Créez des formulaires}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 3 (+ 3)
% Row 1
\SetRowColor{white}
\textless{}form\textgreater{}\textless{}/form\textgreater{} &  & Indique le début et la fin du formulaire \tn 
% Row Count 6 (+ 3)
% Row 2
\SetRowColor{LightBackground}
action &  & adresse de la page ou du programme qui va traiter les informations \tn 
% Row Count 10 (+ 4)
% Row 3
\SetRowColor{white}
\{\{rowspan=2\}\}method & get &  \tn 
% Row Count 13 (+ 3)
% Row 4
\SetRowColor{LightBackground}
 & post &  \tn 
% Row Count 14 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{\textless{}p\textgreater{}Texte avant le formulaire\textless{}/p\textgreater{} \newline     \textless{}form method="get" action=""\textgreater{} \newline         \textless{}p\textgreater{}Texte à l'intérieur du formulaire\textless{}/p\textgreater{} \newline     \textless{}/form\textgreater{} \newline \textless{}p\textgreater{}Texte après le formulaire\textless{}/p\textgreater{}}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{4.64 cm} x{3.36 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Formulaires - Formats de saisie}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Type de champ}} & {\bf{Code}} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
E-mail & \textless{}input type="email"\textgreater{} \tn 
% Row Count 3 (+ 2)
% Row 2
\SetRowColor{LightBackground}
URL & \textless{}input type="url"\textgreater{} \tn 
% Row Count 5 (+ 2)
% Row 3
\SetRowColor{white}
Numéro de téléphone & \textless{}input type="tel"\textgreater{} \tn 
% Row Count 7 (+ 2)
% Row 4
\SetRowColor{LightBackground}
Nombre entier & \textless{}input type="number"\textgreater{} \tn 
% Row Count 9 (+ 2)
% Row 5
\SetRowColor{white}
Curseur ("slider") & \textless{}input type="range"\textgreater{} \tn 
% Row Count 11 (+ 2)
% Row 6
\SetRowColor{LightBackground}
Date & \textless{}input type="date"\textgreater{} \tn 
% Row Count 13 (+ 2)
% Row 7
\SetRowColor{white}
Heure & \textless{}input type="time"\textgreater{} \tn 
% Row Count 15 (+ 2)
% Row 8
\SetRowColor{LightBackground}
Semaine & \textless{}input type="week"\textgreater{} \tn 
% Row Count 17 (+ 2)
% Row 9
\SetRowColor{white}
Mois & \textless{}input type="month" \tn 
% Row Count 19 (+ 2)
% Row 10
\SetRowColor{LightBackground}
Date et heure (avec gestion du décalage horaire) & \textless{}input type="datetime"\textgreater{} \tn 
% Row Count 22 (+ 3)
% Row 11
\SetRowColor{white}
Date et heure (sans gestion du décalage horaire) & \textless{}input type="datetime-local"\textgreater{} \tn 
% Row Count 25 (+ 3)
% Row 12
\SetRowColor{LightBackground}
Recherche & \textless{}input type="search"\textgreater{} \tn 
% Row Count 27 (+ 2)
% Row 13
\SetRowColor{white}
Cases à cocher (plusieurs choix possibles) & \textless{}input type="checkbox"\textgreater{} \tn 
% Row Count 29 (+ 2)
% Row 14
\SetRowColor{LightBackground}
Boutons radio (un seul choix possible) & \textless{}input type="radio"\textgreater{} \tn 
% Row Count 31 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{Pour les types de champs nombre, date et curseur, vous pouvez personnaliser le fonctionnement du champ avec les attributs suivants : \newline  \newline min  : valeur minimale autorisée \newline  \newline max  : valeur maximale autorisée \newline  \newline step  : c'est un "pas" de déplacement. \newline Si vous indiquez un pas de 2, le champ n'acceptera que des valeurs de 2 en 2 (par exemple 0, 2, 4, 6…).}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.976 cm} x{1.976 cm} x{3.648 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Formulaire - Champs de texte}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 3 (+ 3)
% Row 1
\SetRowColor{white}
\textless{}input\textgreater{} &  & balise orpheline \tn 
% Row Count 4 (+ 1)
% Row 2
\SetRowColor{LightBackground}
 & \seqsplit{type="text"} & Ajoute une zone de texte monoligne \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
 & \seqsplit{name="prenom"} & identifie le champ d'où viennent les informations \tn 
% Row Count 9 (+ 3)
% Row 4
\SetRowColor{LightBackground}
 & size & Agrandir le champ \tn 
% Row Count 10 (+ 1)
% Row 5
\SetRowColor{white}
 & maxlength & Limiter le nombre de caractères que l'on peut saisir \tn 
% Row Count 13 (+ 3)
% Row 6
\SetRowColor{LightBackground}
 & value & Pré-remplir le champ avec une valeur par défaut \tn 
% Row Count 16 (+ 3)
% Row 7
\SetRowColor{white}
 & \seqsplit{placeholder} & donner une indication sur le contenu du champ \tn 
% Row Count 19 (+ 3)
% Row 8
\SetRowColor{LightBackground}
\textless{}label\textgreater{} \textless{}/label\textgreater{} &  & Crée un champ de texte prérempli \tn 
% Row Count 21 (+ 2)
% Row 9
\SetRowColor{white}
 & id="" & Identifie l'élément HTML \tn 
% Row Count 23 (+ 2)
% Row 10
\SetRowColor{LightBackground}
 & for="" & A la même valeur que l'id du champ \tn 
% Row Count 25 (+ 2)
% Row 11
\SetRowColor{white}
\textless{}textarea\textgreater{} \textless{}/textarea\textgreater{} &  & Créer une zone de texte multiligne \tn 
% Row Count 28 (+ 3)
% Row 12
\SetRowColor{LightBackground}
 & rows & Nombre de lignes qui peuvent être affichées \tn 
% Row Count 31 (+ 3)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{1.976 cm} x{1.976 cm} x{3.648 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Formulaire - Champs de texte (cont)}}  \tn
% Row 13
\SetRowColor{LightBackground}
 & cols & Nombre de colonnes qui peuvent être affichées \tn 
% Row Count 3 (+ 3)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2.508 cm} x{1.824 cm} x{3.268 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Formulaires - Liste déroulante}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 3 (+ 3)
% Row 1
\SetRowColor{white}
\textless{}select\textgreater{} \textless{}/select\textgreater{} &  & Indiquer le début et la fin de la liste déroulante \tn 
% Row Count 7 (+ 4)
% Row 2
\SetRowColor{LightBackground}
 & name & Donner un nom à la liste \tn 
% Row Count 9 (+ 2)
% Row 3
\SetRowColor{white}
\{\{rowspan=3\}\}\textless{}option\textgreater{} \textless{}/option\textgreater{} &  & Une par choix possible \tn 
% Row Count 12 (+ 3)
% Row 4
\SetRowColor{LightBackground}
 & value & Identifier ce que le visiteur a choisi \tn 
% Row Count 15 (+ 3)
% Row 5
\SetRowColor{white}
 & selected & L'option est sélectionnée par défaut \tn 
% Row Count 18 (+ 3)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{\textless{}form method="get" action=""\textgreater{} \newline     \textless{}p\textgreater{} \newline         \textless{}label for="pays"\textgreater{}Dans quel pays habitez-vous ?\textless{}/label\textgreater{}\textless{}br\textgreater{} \newline         \textless{}select name="pays" id="pays"\textgreater{} \newline             \textless{}option value="canada" selected\textgreater{}Canada\textless{}/option\textgreater{} \newline             \textless{}option value="japon"selected\textgreater{}Japon\textless{}/option\textgreater{} \newline         \textless{}/select\textgreater{} \newline     \textless{}/p\textgreater{} \newline \textless{}/form\textgreater{}}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.976 cm} x{2.964 cm} x{2.66 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés des boîtes - Width \& Height}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Property}} & {\bf{Example Values}} & {\bf{Use Case}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
width & 150px, 80\%, etc. & Largeur \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
height & 150px, 80\%, etc. & Hauteur \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
min-width & 150px, 80\%, etc. & Largeur minimale \tn 
% Row Count 8 (+ 2)
% Row 4
\SetRowColor{LightBackground}
max-width & 150px, 80\%, etc. & Largeur maximale \tn 
% Row Count 10 (+ 2)
% Row 5
\SetRowColor{white}
\seqsplit{min-height} & 150px, 80\%, etc. & Hauteur minimale \tn 
% Row Count 12 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{max-height} & 150px, 80\%, etc. & Hauteur maximale \tn 
% Row Count 14 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{{\bf{auto}} means the computer will calculate the heights and widths for you. \newline {\bf{Initial}} means default value. \newline {\bf{Inherit}} means get values from parent element. \newline For {\bf{width}}, use the \% so that it can be scaled as a percentage of the parent width. \newline {\bf{max-width}} allows the browser to better handle horizontal scrollbars when the available view port width becomes smaller than, say, the size of a div. \newline When using max-width, don't give an element a width. The latter overrides the former.}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.444 cm} x{3.116 cm} x{3.04 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés des boîtes - Borders}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Property}} & {\bf{Example Values}} & {\bf{Effects}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\seqsplit{border-width} & 3px & Épaisseur de bordure \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{border-color} & nom, RGB (rouge,vert,bleu), ou RGBA (rouge,vert,bleu,tr ansparence), \#CF1A20 & Couleur de bordure \tn 
% Row Count 9 (+ 5)
% Row 3
\SetRowColor{white}
\seqsplit{border-style} & solid, dotted, dashed, double, groove, ridge, inset, outset. & Type de bordure \tn 
% Row Count 13 (+ 4)
% Row 4
\SetRowColor{LightBackground}
border & 3px solid black & \seqsplit{Super-propriété} de bordure qui combine : border-width, border-color, border-style. Existe aussi en version border-top, border-right, border-bottom, border-left. \tn 
% Row Count 24 (+ 11)
% Row 5
\SetRowColor{white}
\seqsplit{border-radius} & 5px & Bordure arrondie \tn 
% Row Count 27 (+ 3)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{box-shadow} & 6px 6px 0px black (horizontale, verticale, fondu, couleur) & Ombre de boîte \tn 
% Row Count 31 (+ 4)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{1.444 cm} x{3.116 cm} x{3.04 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés des boîtes - Borders (cont)}}  \tn
% Row 7
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{} \tn 
% Row Count 0 (+ 0)
% Row 8
\SetRowColor{white}
\mymulticolumn{3}{x{8.4cm}}{} \tn 
% Row Count 0 (+ 0)
% Row 9
\SetRowColor{LightBackground}
\seqsplit{border-spacing} & 20px, 30px (horizontal then vertical space) ... & Set space between cells of table \tn 
% Row Count 4 (+ 4)
% Row 10
\SetRowColor{white}
\seqsplit{border-collapse} & collapse, separate & Whether borders of table cells should be joint or not \tn 
% Row Count 8 (+ 4)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{{\bf{Note}} that none of the other border properties will work without specifying a border-style first. \newline {\bf{If}} border-color is not set, it inherits the color of the parent. \newline {\bf{To}} set border-\{property\} for specific sides do: border-\{property\}: \{top\} \{right\} \{bottom\} \{left\} {\bf{or}} border-\{property\}: \{top\&bottom\} \{right\&left\} \newline {\bf{Border shorthand}} is border: \{width\} \{style\} \{color\}. \newline {\bf{border-collapse}} can be used with border-spacing to style tables.}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.216 cm} x{3.192 cm} x{3.192 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés des boîtes - Margin}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Propriété}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 3 (+ 3)
% Row 1
\SetRowColor{white}
\seqsplit{margin-top} & 23px & Marge en haut \tn 
% Row Count 5 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{margin-left} & 23px & Marge en gauche \tn 
% Row Count 7 (+ 2)
% Row 3
\SetRowColor{white}
\seqsplit{margin-right} & 23px & Marge en droite \tn 
% Row Count 9 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{margin-bottom} & 23px & Marge en bas \tn 
% Row Count 12 (+ 3)
% Row 5
\SetRowColor{white}
\seqsplit{margin} & 23px 5px 23px 5px (haut, droite, bas, gauche) & \seqsplit{Super-propriété} de marge qui combine : margin-top, margin-right, margin-bottom, margin-left. \tn 
% Row Count 18 (+ 6)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{{\bf{Margin}} is the space around the border of an element. \newline Margin values should be in {\bf{px}}. \newline {\bf{margin: auto}} means horizontally center the element within its container, and {\bf{margin: inherit}} means inherit margin from parent element.}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.216 cm} x{3.192 cm} x{3.192 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés des boîtes - Padding}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Propriété}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 3 (+ 3)
% Row 1
\SetRowColor{white}
\seqsplit{padding-left} & 23px & Marge intérieure en gauche \tn 
% Row Count 5 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{padding-right} & 23px & Marge intérieure en droite \tn 
% Row Count 8 (+ 3)
% Row 3
\SetRowColor{white}
\seqsplit{padding-bottom} & 23px & Marge intérieure en bas \tn 
% Row Count 11 (+ 3)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{padding-top} & 23px & Marge intérieure en haut \tn 
% Row Count 13 (+ 2)
% Row 5
\SetRowColor{white}
\seqsplit{padding} & 23px 5px 23px 5px (haut, droite, bas, gauche) & \seqsplit{Super-propriété} de marge qui combine : padding-top, padding-right, padding-bottom, padding-left. \tn 
% Row Count 20 (+ 7)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{{\bf{Padding}} is the distance between an element and its border. \newline Values can be in {\bf{length}} e.g 2px, {\bf{\%}} (percentage of the width of the containing element), or {\bf{inherit}} (from parent element). \newline You can use the shorthand padding to set padding on all sides. \newline If an element has a specified width, adding padding will add to the initial width.}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.216 cm} x{3.192 cm} x{3.192 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés de mise en forme du texte}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Propriété}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 3 (+ 3)
% Row 1
\SetRowColor{white}
\seqsplit{font-family} & police1, serif, monosp & Nom de police \tn 
% Row Count 5 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{@font-face} & Nom et source de la police & Police personnalisée \tn 
% Row Count 7 (+ 2)
% Row 3
\SetRowColor{white}
\seqsplit{font-size} & 1.3em, 16px, 120\%, etc. & Taille du texte \tn 
% Row Count 9 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{font-weight} & bold, normal. & Gras \tn 
% Row Count 11 (+ 2)
% Row 5
\SetRowColor{white}
\seqsplit{font-style} & italic, oblique, normal. & Italique \tn 
% Row Count 13 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{text-decoration} & underline, overline, line-through, blink, none. & Soulignement, ligne au-dessus, barré ou clignotant \tn 
% Row Count 17 (+ 4)
% Row 7
\SetRowColor{white}
\seqsplit{font-variant} & small-caps, normal. & Petites capitales \tn 
% Row Count 19 (+ 2)
% Row 8
\SetRowColor{LightBackground}
\seqsplit{text-transform} & capitalize, lowercase, uppercase. & Capitales \tn 
% Row Count 22 (+ 3)
% Row 9
\SetRowColor{white}
font & - & \seqsplit{Super-propriété} de police qui combine : font-weight, font-style, font-size, font-variant, font-family \tn 
% Row Count 29 (+ 7)
% Row 10
\SetRowColor{LightBackground}
\seqsplit{text-align} & left, center, right, justify. & Alignement horizontal \tn 
% Row Count 31 (+ 2)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{1.216 cm} x{3.192 cm} x{3.192 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés de mise en forme du texte (cont)}}  \tn
% Row 11
\SetRowColor{LightBackground}
\seqsplit{vertical-align} & baseline, middle, sub, super, top, bottom & Alignement vertical (cellules de tableau ou éléments inline-block uniquement) \tn 
% Row Count 5 (+ 5)
% Row 12
\SetRowColor{white}
\seqsplit{line-height} & 18px, 120\%, normal, etc. & Hauteur de ligne \tn 
% Row Count 7 (+ 2)
% Row 13
\SetRowColor{LightBackground}
\seqsplit{text-indent} & 25px & Alinéa \tn 
% Row Count 9 (+ 2)
% Row 14
\SetRowColor{white}
\seqsplit{white-space} & pre, nowrap, normal. & normal. Césure \tn 
% Row Count 11 (+ 2)
% Row 15
\SetRowColor{LightBackground}
\seqsplit{word-wrap} & break-word, normal. & Césure forcée \tn 
% Row Count 13 (+ 2)
% Row 16
\SetRowColor{white}
\seqsplit{text-shadow} & 5px 5px 2px blue (horizontale, verticale, fondu, couleur) & Ombre de texte \tn 
% Row Count 17 (+ 4)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.216 cm} x{3.192 cm} x{3.192 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés de positionnement et d'affichage}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Propriété}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 3 (+ 3)
% Row 1
\SetRowColor{white}
\seqsplit{display} & block, inline, inline-block, table, table-cell, none. & Type d'élément (block, inline, inline-block, none…) \tn 
% Row Count 7 (+ 4)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{visibility} & visible, hidden. & Visibilité \tn 
% Row Count 9 (+ 2)
% Row 3
\SetRowColor{white}
clip & rect (0px, 60px, 30px, 0px) rect (haut, droite, bas, gauche) & Affichage d'une partie de l'élément \tn 
% Row Count 13 (+ 4)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{overflow} & auto, scroll, visible, hidden. & Comportement en cas de dépassement \tn 
% Row Count 16 (+ 3)
% Row 5
\SetRowColor{white}
float & left, right, none. & Flottant \tn 
% Row Count 18 (+ 2)
% Row 6
\SetRowColor{LightBackground}
clear & left, right, both, none. & Arrêt d'un flottant \tn 
% Row Count 20 (+ 2)
% Row 7
\SetRowColor{white}
\seqsplit{position} & relative, absolute, fixed, sticky & Positionnement \tn 
% Row Count 23 (+ 3)
% Row 8
\SetRowColor{LightBackground}
top & 20px & Position par rapport au haut \tn 
% Row Count 25 (+ 2)
% Row 9
\SetRowColor{white}
\seqsplit{bottom} & 20px & Position par rapport au bas \tn 
% Row Count 27 (+ 2)
% Row 10
\SetRowColor{LightBackground}
left & 20px & Position par rapport à la gauche \tn 
% Row Count 30 (+ 3)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{1.216 cm} x{3.192 cm} x{3.192 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés de positionnement et d'affichage (cont)}}  \tn
% Row 11
\SetRowColor{LightBackground}
right & 20px & Position par rapport à la droite \tn 
% Row Count 3 (+ 3)
% Row 12
\SetRowColor{white}
\seqsplit{z-index} & 10 & Ordre d'affichage en cas de superposition. La plus grande valeur est affichée par-dessus les autres. \tn 
% Row Count 10 (+ 7)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.444 cm} x{3.116 cm} x{3.04 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés des listes}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Propriété}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 3 (+ 3)
% Row 1
\SetRowColor{white}
\seqsplit{list-style-type} & disc, circle, square, decimal, lower-roman, upper-roman, lower-alpha, upper-alpha, none. & Type de liste \tn 
% Row Count 9 (+ 6)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{list-style-position} & inside, outside. & Position en retrait \tn 
% Row Count 12 (+ 3)
% Row 3
\SetRowColor{white}
\seqsplit{list-style-image} & URL ('puce.png') & Puce personnalisée \tn 
% Row Count 15 (+ 3)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{list-style} & - & \seqsplit{Super-propriété} de liste qui combine : list-style-type, \seqsplit{list-style-position}, \seqsplit{list-style-image}. \tn 
% Row Count 21 (+ 6)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.748 cm} x{2.356 cm} x{3.496 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Grids WIP}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Propriété}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
grid & .container \{display: grid;\} & Déclare une grid sur le conteneur \tn 
% Row Count 5 (+ 3)
% Row 2
\SetRowColor{LightBackground}
unités & px, em, rem, \%, fr & fr = fraction de largeur \tn 
% Row Count 7 (+ 2)
% Row 3
\SetRowColor{white}
gap & 10px & Espacements entre les éléments \tn 
% Row Count 9 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{grid-template-colums} & 200px 200px 200px & Nombre de colonnes et largeur \tn 
% Row Count 12 (+ 3)
% Row 5
\SetRowColor{white}
\seqsplit{grid-template-rows} & 150px 150px 150px & Nombre de rangées et hauteur \tn 
% Row Count 14 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{grid-column-start} &  & Indique la ligne verticale de départ de l'élément \tn 
% Row Count 17 (+ 3)
% Row 7
\SetRowColor{white}
\seqsplit{grid-column-end} &  & Indique la ligne verticale d'arrivée de l'élément \tn 
% Row Count 20 (+ 3)
% Row 8
\SetRowColor{LightBackground}
\seqsplit{grid-row-start} &  & Indique la ligne horizontale de départ de l'élément \tn 
% Row Count 23 (+ 3)
% Row 9
\SetRowColor{white}
\seqsplit{grid-raw-end} &  & Indique la ligne horizontale d'arrivée de l'élément \tn 
% Row Count 26 (+ 3)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2.052 cm} x{2.736 cm} x{2.812 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Flexbox}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Propriété}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
flex & `.container \{display: flex;\}` & Aligne les éléments d'un conteneur \tn 
% Row Count 5 (+ 3)
% Row 2
\SetRowColor{LightBackground}
\{\{rowspan=4\}\} \seqsplit{flex-direction} & `.container \{display: flex; \seqsplit{flex-direction:} column;\}` & Agence les éléments dans le sens choisi \tn 
% Row Count 9 (+ 4)
% Row 3
\SetRowColor{white}
 & row & Organise les éléments sur une ligne \tn 
% Row Count 12 (+ 3)
% Row 4
\SetRowColor{LightBackground}
 & column & Organise les éléments sur une colonne \tn 
% Row Count 15 (+ 3)
% Row 5
\SetRowColor{white}
 & row-reverse & Organise les éléments sur une ligne en ordre inversé \tn 
% Row Count 19 (+ 4)
% Row 6
\SetRowColor{LightBackground}
 & \seqsplit{column-reverse} & Organise les éléments sur une colonne inversé \tn 
% Row Count 23 (+ 4)
% Row 7
\SetRowColor{white}
\{\{rowspan=4\}\} flex-wrap & `.container \{display: flex; flex-wrap: nowrap;\}` & Gestion des retours a la ligne \tn 
% Row Count 27 (+ 4)
% Row 8
\SetRowColor{LightBackground}
 & nowrap & Pas de retour a la ligne \tn 
% Row Count 29 (+ 2)
% Row 9
\SetRowColor{white}
 & wrap & Retour a la ligne quand il n'y a plus de place \tn 
% Row Count 33 (+ 4)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{2.052 cm} x{2.736 cm} x{2.812 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Flexbox (cont)}}  \tn
% Row 10
\SetRowColor{LightBackground}
 & wrap-reverse & Retour a la ligne quand il n'y a plus de place, en sens inverse \tn 
% Row Count 5 (+ 5)
% Row 11
\SetRowColor{white}
\mymulticolumn{3}{x{8.4cm}}{} \tn 
% Row Count 5 (+ 0)
% Row 12
\SetRowColor{LightBackground}
\{\{rowspan=6\}\} \seqsplit{justify-content} & `.container \{display: flex; \seqsplit{justify-content:} flex-start;\}` & Alignement sur l'axe principal \tn 
% Row Count 10 (+ 5)
% Row 13
\SetRowColor{white}
 & flex-start & alignés au début \tn 
% Row Count 12 (+ 2)
% Row 14
\SetRowColor{LightBackground}
 & flex-end & alignés a la fin \tn 
% Row Count 14 (+ 2)
% Row 15
\SetRowColor{white}
 & center & alignés au centre \tn 
% Row Count 16 (+ 2)
% Row 16
\SetRowColor{LightBackground}
 & space-between & Les éléments sont étirés sur tout l'axe \tn 
% Row Count 20 (+ 4)
% Row 17
\SetRowColor{white}
 & space-around & Les éléments sont étirés mais avec des espaces \tn 
% Row Count 24 (+ 4)
% Row 18
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{} \tn 
% Row Count 24 (+ 0)
% Row 19
\SetRowColor{white}
\{\{rowspan=6\}\} \seqsplit{align-items} & `.container \{display: flex; \seqsplit{justify-content:} center; align-items: center;\}` & Alignement sur l'axe secondaire \tn 
% Row Count 30 (+ 6)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{2.052 cm} x{2.736 cm} x{2.812 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Flexbox (cont)}}  \tn
% Row 20
\SetRowColor{LightBackground}
 & stretch & Les éléments sont étirés sur tout l'axe \tn 
% Row Count 4 (+ 4)
% Row 21
\SetRowColor{white}
 & flex-start & alignés au début \tn 
% Row Count 6 (+ 2)
% Row 22
\SetRowColor{LightBackground}
 & flex-end & alignés a la fin \tn 
% Row Count 8 (+ 2)
% Row 23
\SetRowColor{white}
 & center & alignés au centre \tn 
% Row Count 10 (+ 2)
% Row 24
\SetRowColor{LightBackground}
 & baseline & alignés sur la base (semblable à flex-start) \tn 
% Row Count 14 (+ 4)
% Row 25
\SetRowColor{white}
\mymulticolumn{3}{x{8.4cm}}{} \tn 
% Row Count 14 (+ 0)
% Row 26
\SetRowColor{LightBackground}
\{\{rowspan=7\}\}align-content &  & Répartit les blocs sur plusieurs lignes \tn 
% Row Count 17 (+ 3)
% Row 27
\SetRowColor{white}
 & stretch & Les éléments sont étirés sur tout l'espace \tn 
% Row Count 21 (+ 4)
% Row 28
\SetRowColor{LightBackground}
 & flex-start & Les éléments sont placés au début \tn 
% Row Count 24 (+ 3)
% Row 29
\SetRowColor{white}
 & flex-end & Les éléments sont placés a la fin \tn 
% Row Count 27 (+ 3)
% Row 30
\SetRowColor{LightBackground}
 & center & Les éléments sont placés au centre \tn 
% Row Count 30 (+ 3)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{2.052 cm} x{2.736 cm} x{2.812 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Flexbox (cont)}}  \tn
% Row 31
\SetRowColor{LightBackground}
 & space-between & Les éléments sont séparés avec de l'espace entre eux \tn 
% Row Count 4 (+ 4)
% Row 32
\SetRowColor{white}
 & space-around & idem, mais il y a avec de l'espace au début et à la fin. \tn 
% Row Count 9 (+ 5)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.672 cm} x{2.964 cm} x{2.964 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Media Queries}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Example Code}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
@media & @media screen and (max-width: 8000px) \{ Code CSS \} & Media queries \tn 
% Row Count 6 (+ 4)
% Row 2
\SetRowColor{LightBackground}
{\bf{Règles}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 8 (+ 2)
% Row 3
\SetRowColor{white}
height &  & Hauteur de la zone d'affichage (fenêtre) \tn 
% Row Count 11 (+ 3)
% Row 4
\SetRowColor{LightBackground}
width &  & Largeur de la zone d'affichage (fenêtre) \tn 
% Row Count 14 (+ 3)
% Row 5
\SetRowColor{white}
\seqsplit{orientation} &  & Orientation du périphérique (portrait ou paysage) \tn 
% Row Count 18 (+ 4)
% Row 6
\SetRowColor{LightBackground}
media & screen, all ou print & Ecran, tout type de média, imprimante \tn 
% Row Count 21 (+ 3)
% Row 7
\SetRowColor{white}
min- / max- & height, width & largeur ou hauteur maximale ou minimale \tn 
% Row Count 24 (+ 3)
% Row 8
\SetRowColor{LightBackground}
only &  & Combine les règles \tn 
% Row Count 26 (+ 2)
% Row 9
\SetRowColor{white}
and &  & Combine les règles \tn 
% Row Count 28 (+ 2)
% Row 10
\SetRowColor{LightBackground}
not &  & Combine les règles \tn 
% Row Count 30 (+ 2)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{1.672 cm} x{2.964 cm} x{2.964 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Media Queries (cont)}}  \tn
% Row 11
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{} \tn 
% Row Count 0 (+ 0)
% Row 12
\SetRowColor{white}
\{\{rowspan=4\}\} \seqsplit{overflow} & visible & si le texte dépasse les limites de taille, il reste visible et Sort volontairement du bloc \tn 
% Row Count 7 (+ 7)
% Row 13
\SetRowColor{LightBackground}
 & hidden & Si le texte dépasse les limites, il serac caché \tn 
% Row Count 11 (+ 4)
% Row 14
\SetRowColor{white}
 & scroll & Si le texte dépasse les limites, ajoute des barres de défilement \tn 
% Row Count 16 (+ 5)
% Row 15
\SetRowColor{LightBackground}
 & auto & C'est le navigateur qui décide de mettre ou non des barres de défilement \tn 
% Row Count 21 (+ 5)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{@media screen and (max-width: 8000px) \{ \newline p \{ \newline     width: 250px; \newline     height: 110px; \newline     text-align: justify; \newline     overflow: auto; \newline \} \newline \}}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{4 cm} x{4 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Créer des liens}}  \tn
% Row 0
\SetRowColor{LightBackground}
\textless{}a href="URL"\textgreater{}Texte\textless{}/a\textgreater{} & Lien vers un autre site \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\textless{}a href="nomdepage.html"\textgreater{}Texte\textless{}/a\textgreater{} & Page dans le même dossier \tn 
% Row Count 5 (+ 3)
% Row 2
\SetRowColor{LightBackground}
\textless{} a \seqsplit{href="nomdudossier/nomdepage}.html"\textgreater{}Texte\textless{}/a\textgreater{} & Page dans un autre dossier \tn 
% Row Count 9 (+ 4)
% Row 3
\SetRowColor{white}
\textless{}a href="../nomdepage.html"\textgreater{}Texte\textless{}/a\textgreater{} & Page dans un dossier parent \tn 
% Row Count 12 (+ 3)
% Row 4
\SetRowColor{LightBackground}
\textless{}a href="\#nomdelancre"\textgreater{}Texte\textless{}/a\textgreater{} & Lien vers une ancre \tn 
% Row Count 15 (+ 3)
% Row 5
\SetRowColor{white}
\textless{}a href="ancre.html\#ancre"\textgreater{}Texte\textless{}/a\textgreater{} & Lien vers une ancre dans une autre page \tn 
% Row Count 18 (+ 3)
% Row 6
\SetRowColor{LightBackground}
\textless{}a href="URL" title="Texte"\textgreater{}Texte\textless{}/a\textgreater{} & Info bulle \tn 
% Row Count 21 (+ 3)
% Row 7
\SetRowColor{white}
\textless{}a href="URL" title="Texte" target="\_blank"\textless{}/a\textgreater{} & Ouverture dans une nouvelle fenêtre \tn 
% Row Count 25 (+ 4)
% Row 8
\SetRowColor{LightBackground}
\textless{}a href="mailto:email\_adresse"\textgreater{}Texte\textless{}/a\textgreater{} & Email \tn 
% Row Count 28 (+ 3)
% Row 9
\SetRowColor{white}
\textless{}a href="nom.zip"\textgreater{}Texte\textless{}/a\textgreater{} & Téléchargement fichier même dossier \tn 
% Row Count 31 (+ 3)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{4 cm} x{4 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Créer des liens (cont)}}  \tn
% Row 10
\SetRowColor{LightBackground}
\textless{}a \seqsplit{href="nomdudossier/nom}.zip"\textgreater{}Texte\textless{}/a\textgreater{} & Téléchargement fichier autre dossier \tn 
% Row Count 3 (+ 3)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.84 cm} x{6.16 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Balises de structuration du texte}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\textless{}abbr\textgreater{} & Abréviation \tn 
% Row Count 3 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\textless{}blockquote\textgreater{} & Citation (longue) \tn 
% Row Count 5 (+ 2)
% Row 3
\SetRowColor{white}
\textless{}cite\textgreater{} & Citation du titre d'une œuvre ou d'un événement \tn 
% Row Count 7 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\textless{}q\textgreater{} & Citation (courte) \tn 
% Row Count 8 (+ 1)
% Row 5
\SetRowColor{white}
\textless{}sup\textgreater{} & Exposant \tn 
% Row Count 9 (+ 1)
% Row 6
\SetRowColor{LightBackground}
\textless{}sub\textgreater{} & Indice \tn 
% Row Count 10 (+ 1)
% Row 7
\SetRowColor{white}
\textless{}strong\textgreater{} & Mise en valeur forte \tn 
% Row Count 11 (+ 1)
% Row 8
\SetRowColor{LightBackground}
\textless{}em\textgreater{} & Mise en valeur normale \tn 
% Row Count 12 (+ 1)
% Row 9
\SetRowColor{white}
\textless{}mark\textgreater{} & Mise en valeur visuelle \tn 
% Row Count 13 (+ 1)
% Row 10
\SetRowColor{LightBackground}
\textless{}h1\textgreater{} & Titre de niveau 1 \tn 
% Row Count 14 (+ 1)
% Row 11
\SetRowColor{white}
\textless{}h2\textgreater{} & Titre de niveau 2 \tn 
% Row Count 15 (+ 1)
% Row 12
\SetRowColor{LightBackground}
\textless{}h3\textgreater{} & Titre de niveau 3 \tn 
% Row Count 16 (+ 1)
% Row 13
\SetRowColor{white}
\textless{}h4\textgreater{} & Titre de niveau 4 \tn 
% Row Count 17 (+ 1)
% Row 14
\SetRowColor{LightBackground}
\textless{}h5\textgreater{} & Titre de niveau 5 \tn 
% Row Count 18 (+ 1)
% Row 15
\SetRowColor{white}
\textless{}h6\textgreater{} & Titre de niveau 6 \tn 
% Row Count 19 (+ 1)
% Row 16
\SetRowColor{LightBackground}
\textless{}img\textgreater{} & Image (balise orpheline). \tn 
% Row Count 20 (+ 1)
% Row 17
\SetRowColor{white}
\textless{}figure\textgreater{} & Figure (image, code, etc.) \tn 
% Row Count 21 (+ 1)
% Row 18
\SetRowColor{LightBackground}
\textless{}figcaption\textgreater{} & Description de la figure \tn 
% Row Count 23 (+ 2)
% Row 19
\SetRowColor{white}
\textless{}audio\textgreater{} & Son \tn 
% Row Count 24 (+ 1)
% Row 20
\SetRowColor{LightBackground}
\textless{}video\textgreater{} & Vidéo \tn 
% Row Count 25 (+ 1)
% Row 21
\SetRowColor{white}
\textless{}source\textgreater{} & Format source pour les balises \textless{}audio\textgreater{} et \textless{}video\textgreater{} \tn 
% Row Count 27 (+ 2)
% Row 22
\SetRowColor{LightBackground}
\textless{}a\textgreater{} & Lien hypertexte \tn 
% Row Count 28 (+ 1)
% Row 23
\SetRowColor{white}
\textless{}br\textgreater{} & Retour à la ligne (balise orpheline). \tn 
% Row Count 30 (+ 2)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{1.84 cm} x{6.16 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Balises de structuration du texte (cont)}}  \tn
% Row 24
\SetRowColor{LightBackground}
\textless{}p\textgreater{} & Paragraphe \tn 
% Row Count 1 (+ 1)
% Row 25
\SetRowColor{white}
\textless{}hr\textgreater{} & Ligne de séparation horizontale \tn 
% Row Count 3 (+ 2)
% Row 26
\SetRowColor{LightBackground}
\textless{}address\textgreater{} & Adresse de contact \tn 
% Row Count 4 (+ 1)
% Row 27
\SetRowColor{white}
\textless{}del\textgreater{} & Texte supprimé \tn 
% Row Count 5 (+ 1)
% Row 28
\SetRowColor{LightBackground}
\textless{}ins\textgreater{} & Texte inséré \tn 
% Row Count 6 (+ 1)
% Row 29
\SetRowColor{white}
\textless{}dfn\textgreater{} & Définition \tn 
% Row Count 7 (+ 1)
% Row 30
\SetRowColor{LightBackground}
\textless{}kbd\textgreater{} & Saisie clavier \tn 
% Row Count 8 (+ 1)
% Row 31
\SetRowColor{white}
\textless{}pre\textgreater{} & Affichage formaté (pour les codes sources) \tn 
% Row Count 10 (+ 2)
% Row 32
\SetRowColor{LightBackground}
\textless{}progress\textgreater{} & Barre de progression \tn 
% Row Count 12 (+ 2)
% Row 33
\SetRowColor{white}
\textless{}time\textgreater{} & Date ou heure \tn 
% Row Count 13 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{3.116 cm} x{1.368 cm} x{3.116 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Format Audio et Video}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Format}} & {\bf{Extention}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\{\{rowspan=4\}\}Audio & .MP3 & Le plus compatible \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
 & .AAC & Majoritairement Apple \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
 & .Ogg & Format libre \tn 
% Row Count 7 (+ 1)
% Row 4
\SetRowColor{LightBackground}
 & .Wav & Evitez, le .BMP de l'audio \tn 
% Row Count 9 (+ 2)
% Row 5
\SetRowColor{white}
\{\{rowspan=2\}\}Video - Conteneur & .MP4 &  \tn 
% Row Count 11 (+ 2)
% Row 6
\SetRowColor{LightBackground}
 & .AVI &  \tn 
% Row Count 12 (+ 1)
% Row 7
\SetRowColor{white}
 & .Mkv &  \tn 
% Row Count 13 (+ 1)
% Row 8
\SetRowColor{LightBackground}
\{\{rowspan=2\}\}Video - Codec & H.264 & Le + puissant et le + utiliser \tn 
% Row Count 15 (+ 2)
% Row 9
\SetRowColor{white}
 & .Ogg Theora & Linux user Fiendly \tn 
% Row Count 17 (+ 2)
% Row 10
\SetRowColor{LightBackground}
 & WebM & Libre by Google \tn 
% Row Count 18 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.064 cm} x{3.268 cm} x{3.268 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Insertion Audio}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\textless{}audio\textgreater{} & \textless{}audio \seqsplit{src="fichier.mp3"} {\emph{Attributs}}\textgreater{}\textless{}/audio\textgreater{} & Insertion d'un élément audio \tn 
% Row Count 5 (+ 3)
% Row 2
\SetRowColor{LightBackground}
{\bf{Attributs}} & {\bf{Exemples}} & {\bf{Description}} \tn 
% Row Count 8 (+ 3)
% Row 3
\SetRowColor{white}
\seqsplit{controls} &  & Ajoute un lecteur \tn 
% Row Count 10 (+ 2)
% Row 4
\SetRowColor{LightBackground}
width &  & Largeur du lecteur audio \tn 
% Row Count 12 (+ 2)
% Row 5
\SetRowColor{white}
loop &  & Musique en boucle \tn 
% Row Count 13 (+ 1)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{autoplay} &  & la musique se lance dès le chargement de la page \tn 
% Row Count 16 (+ 3)
% Row 7
\SetRowColor{white}
\seqsplit{preload} &  & indique le prechargement de la musique \tn 
% Row Count 19 (+ 3)
% Row 8
\SetRowColor{LightBackground}
 & auto & Le navigateur décide \tn 
% Row Count 21 (+ 2)
% Row 9
\SetRowColor{white}
 & metadata & précharge uniquement les metdonnées \tn 
% Row Count 24 (+ 3)
% Row 10
\SetRowColor{LightBackground}
 & none & pas de préchargement \tn 
% Row Count 26 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{Exemple: \newline \textless{}audio src="fichier.mp3" controls\textgreater{}\textless{}/audio\textgreater{} \newline Ou \newline \textless{}audio controls\textgreater{} \newline \textless{}source src="fichier.mp3"\textgreater{} \newline \textless{}source src="fichier.ogg"\textgreater{} \newline \textless{}/audio\textgreater{}}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.064 cm} x{3.268 cm} x{3.268 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Insertion Video}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\textless{}video\textgreater{} & \textless{}videio \seqsplit{src="fichier.mp4"} {\emph{Attributs}}\textgreater{}\textless{}/audio\textgreater{} & Insertion d'un élément video \tn 
% Row Count 5 (+ 3)
% Row 2
\SetRowColor{LightBackground}
{\bf{Attributs}} & {\bf{Exemples}} & {\bf{Description}} \tn 
% Row Count 8 (+ 3)
% Row 3
\SetRowColor{white}
\seqsplit{poster} &  & Image de la vidéo \tn 
% Row Count 10 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{controls} &  & Ajoute un lecteur \tn 
% Row Count 12 (+ 2)
% Row 5
\SetRowColor{white}
width &  & Largeur du lecteur video \tn 
% Row Count 14 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{height} &  & hauteur de la vidéo \tn 
% Row Count 16 (+ 2)
% Row 7
\SetRowColor{white}
loop &  & Vidéo en boucle \tn 
% Row Count 17 (+ 1)
% Row 8
\SetRowColor{LightBackground}
\seqsplit{autoplay} &  & la vidéo se lance dès le chargement de la page \tn 
% Row Count 20 (+ 3)
% Row 9
\SetRowColor{white}
\seqsplit{preload} &  & indique le prechargement de la vidéo \tn 
% Row Count 23 (+ 3)
% Row 10
\SetRowColor{LightBackground}
 & auto & Le navigateur décide \tn 
% Row Count 25 (+ 2)
% Row 11
\SetRowColor{white}
 & metadata & précharge uniquement les metdonnées \tn 
% Row Count 28 (+ 3)
% Row 12
\SetRowColor{LightBackground}
 & none & pas de préchargement \tn 
% Row Count 30 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{Exemple: \newline \textless{}video src="fichier.mp4" controls poster="image.jpg" width="600"\textgreater{}\textless{}/video\textgreater{} \newline Ou \newline \textless{}video controls poster="image.jpg" width="600"\textgreater{} \newline \textless{}source src="fichier.mp4"\textgreater{} \newline \textless{}source src="fichier.webm"\textgreater{} \newline \textless{}source src="fichier.ogv"\textgreater{} \newline \textless{}/video\textgreater{}}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.292 cm} x{3.42 cm} x{2.888 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Selecteurs}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Selecteur}} & {\bf{Action}} & {\bf{Exemple}} \tn 
% Row Count 3 (+ 3)
% Row 1
\SetRowColor{white}
\seqsplit{Universel} & Sélectionne toutes les balises & * \{ Code CSS \} \tn 
% Row Count 5 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{Element} & Sélectionne un élément & p \{ Code CSS \} \tn 
% Row Count 7 (+ 2)
% Row 3
\SetRowColor{white}
Id & Sélectionne un élément par son ID & \# \{ Code CSS \} \tn 
% Row Count 9 (+ 2)
% Row 4
\SetRowColor{LightBackground}
Class & Sélectionne un élément par sa Class & . \{ Code CSS \} \tn 
% Row Count 12 (+ 3)
% Row 5
\SetRowColor{white}
\seqsplit{Element} + Class & Sélectionne un élément avec la class & p.par1 \{ Code CSS \} \tn 
% Row Count 15 (+ 3)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{Groupe} & Sélectionne plusieurs éléments & h1,p,tr \{ Code CSS \} \tn 
% Row Count 17 (+ 2)
% Row 7
\SetRowColor{white}
\seqsplit{Imbriqué} & Sélectionne une balise dans une balise & h1 em \{ Code CSS \} \tn 
% Row Count 20 (+ 3)
% Row 8
\SetRowColor{LightBackground}
\seqsplit{Suivante} & Sélectionne une balise qui en suit une autre & h1 + p \{ Code CSS \} \tn 
% Row Count 23 (+ 3)
% Row 9
\SetRowColor{white}
\seqsplit{Attribut} & Sélectionne toute le balises avec un attribut & p{[}attribut="Valeur"{]} \{ Code CSS \} \tn 
% Row Count 26 (+ 3)
% Row 10
\SetRowColor{LightBackground}
\seqsplit{Attribut} \seqsplit{strict} & Sélectionne toute le balises avec un attribut strict & p{[}attribut*="Valeur"{]} \{ Code CSS \} \tn 
% Row Count 29 (+ 3)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.6 cm} x{6.4 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Pseudo classes}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Balise}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
:hover & Stylisez un élément au sorvol de la souris \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
:active & Stylisez un élément au clic de la souris \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
:focus & Stylisez un élément sélectionné par le visiteur \tn 
% Row Count 8 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{:visited} & Stylisez un lien hypertexte déja consulté \tn 
% Row Count 10 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{0.988 cm} x{3.344 cm} x{3.268 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Adding CSS Into HTML}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Option}} & {\bf{Example Code}} & {\bf{Use Case}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\seqsplit{External} CSS & \textless{}link rel="stylesheet" href="mystyle.css"\textgreater{} & Link to an external CSS file \tn 
% Row Count 6 (+ 4)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{Internal} CSS & \textless{}style\textgreater{}\{ CSS Code Here\}\textless{}/style\textgreater{} & Add CSS to the \textless{}head\textgreater{} section of your HTML file \tn 
% Row Count 9 (+ 3)
% Row 3
\SetRowColor{white}
\seqsplit{Inline} CSS & \textless{}p style="color:red;"\textgreater{}This is a paragraph.\textless{}/p\textgreater{} & Add CSS directly into a HTML element \tn 
% Row Count 13 (+ 4)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{{\bf{Note}} that the order of preference for selecting which CSS to run is: {\bf{Inline}} Style has highest priority, then {\bf{External}} and {\bf{Internal}} Styles, and finally browser default styles.}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2.204 cm} x{2.736 cm} x{2.66 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{CSS Color Options}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Option}} & {\bf{?}} & {\bf{Example}} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
Color names & Use the exact color name & red, green, blue etc. \tn 
% Row Count 3 (+ 2)
% Row 2
\SetRowColor{LightBackground}
RGB (Red Green Blue) & Use RGB values to produce a color & rgb(255, 255, 255) produces white \tn 
% Row Count 6 (+ 3)
% Row 3
\SetRowColor{white}
RGBA (Red Green Blue Aplha) & Use RGB with an opacity (alpha) & rgba(123, 45, 67 0.4) produces a color that 40\% transparent \tn 
% Row Count 11 (+ 5)
% Row 4
\SetRowColor{LightBackground}
HEX & Use hexadecimal values to produce colors & \#ffffff produces white \tn 
% Row Count 14 (+ 3)
% Row 5
\SetRowColor{white}
HSL (Hue Saturation Light) & Use HSL to produce colors & hsl(120, 50\%, 100\%) produces a 50\% green color \tn 
% Row Count 18 (+ 4)
% Row 6
\SetRowColor{LightBackground}
HSLA (Hue Saturation Light Alpha) & Use HSL with opacity (alpha) & hsla(120, 50\%, 100\%, 0.4) produces a 50\% green color that's 40\% opaque \tn 
% Row Count 23 (+ 5)
\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 Box Model}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{p{8.4cm}}{\vspace{1px}\centerline{\includegraphics[width=5.1cm]{/web/www.cheatography.com/public/uploads/mr-p_1672836919_CSS_Box_Content.png}}} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{Every HTML element has layers around it, which we call a {\bf{box}}. {\bf{Content}} is what's in the layers e.g text. {\bf{Padding}} is transparent area around the content. {\bf{Border}} is area enclosing content and padding. {\bf{Margin}} is transparent area around the border. \newline Setting the width and height of an element with CSS, just sets the width and height of the content area. To calculate the full size of an element, you must also add padding, borders and margins.}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2.052 cm} x{2.736 cm} x{2.812 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés de couleur et de fond}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Propriété}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
color & nom, RGB (rouge,vert,bleu), RGBA (rouge,vert,bleu,t ransparence), \#CF1A20 & Couleur du texte \tn 
% Row Count 8 (+ 6)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{background-color} & red, rgba(0, 123, 45, 0.6), hsl(65, 34\%, 100\%) & Couleur de fond \tn 
% Row Count 12 (+ 4)
% Row 3
\SetRowColor{white}
\seqsplit{background-image} & \seqsplit{url("image.png")} & Couleur de fond \tn 
% Row Count 14 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{background-attachment} & fixed, scroll & Fond fixe ou mobile \tn 
% Row Count 17 (+ 3)
% Row 5
\SetRowColor{white}
\seqsplit{background-repeat} & repeat-x, repeat-y, no-repeat, repeat. & Répétition du fond \tn 
% Row Count 20 (+ 3)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{background-position} & (x y), top, center, bottom, left, right. & Position du fond \tn 
% Row Count 23 (+ 3)
% Row 7
\SetRowColor{white}
\seqsplit{background} & - & \seqsplit{Super-propriété} de fond qui combine : \seqsplit{background-image}, \seqsplit{background-repeat}, \seqsplit{background-attachment}, \seqsplit{background-position} \tn 
% Row Count 32 (+ 9)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{2.052 cm} x{2.736 cm} x{2.812 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés de couleur et de fond (cont)}}  \tn
% Row 8
\SetRowColor{LightBackground}
opacity & 0.0 (0\% opaque), 1.0 (100\% opaque) & Transparence \tn 
% Row Count 3 (+ 3)
% Row 9
\SetRowColor{white}
\mymulticolumn{3}{x{8.4cm}}{} \tn 
% Row Count 3 (+ 0)
% Row 10
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{} \tn 
% Row Count 3 (+ 0)
% Row 11
\SetRowColor{white}
\mymulticolumn{3}{x{8.4cm}}{} \tn 
% Row Count 3 (+ 0)
% Row 12
\SetRowColor{LightBackground}
\seqsplit{background-size} & 100\% (100\% of available screen width) & Size of the background image \tn 
% Row Count 6 (+ 3)
% Row 13
\SetRowColor{white}
\seqsplit{background-clip} & border-box, padding-box, content-box & How far the background (image or color) should extend within an element \tn 
% Row Count 12 (+ 6)
% Row 14
\SetRowColor{LightBackground}
\seqsplit{background-origin} & border-box, padding-box, content-box & Origin position of a background image \tn 
% Row Count 15 (+ 3)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{8.4cm}}{For {\bf{background-clip}}, border-box makes background to extend beyond the border, padding-box, background extends to the inside edge of the border, content-box, background extends to the edge of the content box e.g around a paragraph. With background-origin, it's the same dimensions.}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.216 cm} x{3.192 cm} x{3.192 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés des boîtes}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Propriété}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 3 (+ 3)
% Row 1
\SetRowColor{white}
\seqsplit{margin-top} & 23px & Marge en haut \tn 
% Row Count 5 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{margin-left} & 23px & Marge à gauche \tn 
% Row Count 7 (+ 2)
% Row 3
\SetRowColor{white}
\seqsplit{margin-right} & 23px & Marge à droite \tn 
% Row Count 9 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{margin-bottom} & 23px & Marge en bas \tn 
% Row Count 12 (+ 3)
% Row 5
\SetRowColor{white}
\seqsplit{margin} & 23px 5px 23px 5px (haut, droite, bas, gauche) & \seqsplit{Super-propriété} de marge qui combine : margin-top, margin-right, margin-bottom, margin-left. \tn 
% Row Count 18 (+ 6)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{padding-left} & 23px & Marge intérieure à gauche \tn 
% Row Count 20 (+ 2)
% Row 7
\SetRowColor{white}
\seqsplit{padding-right} & 23px & Marge intérieure à droite \tn 
% Row Count 23 (+ 3)
% Row 8
\SetRowColor{LightBackground}
\seqsplit{padding-bottom} & 23px & Marge intérieure en bas \tn 
% Row Count 26 (+ 3)
% Row 9
\SetRowColor{white}
\seqsplit{padding-top} & 23px & Marge intérieure en haut \tn 
% Row Count 28 (+ 2)
% Row 10
\SetRowColor{LightBackground}
\seqsplit{padding} & 23px 5px 23px 5px (haut, droite, bas, gauche) & \seqsplit{Super-propriété} de marge qui combine : padding-top, padding-right, padding-bottom, padding-left. \tn 
% Row Count 35 (+ 7)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{1.216 cm} x{3.192 cm} x{3.192 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés des boîtes (cont)}}  \tn
% Row 11
\SetRowColor{LightBackground}
\seqsplit{border-width} & 3px & Épaisseur de bordure \tn 
% Row Count 2 (+ 2)
% Row 12
\SetRowColor{white}
\seqsplit{border-color} & nom, RGB (rouge,vert,bleu), ou RGBA (rouge,vert,bleu,tr ansparence), \#CF1A20 & Couleur de bordure \tn 
% Row Count 7 (+ 5)
% Row 13
\SetRowColor{LightBackground}
\seqsplit{border-style} & solid, dotted, dashed, double, groove, ridge, inset, outset. & Type de bordure \tn 
% Row Count 11 (+ 4)
% Row 14
\SetRowColor{white}
\seqsplit{border} & 3px solid black & \seqsplit{Super-propriété} de bordure qui combine : border-width, border-color, border-style. Existe aussi en version border-top, border-right, border-bottom, border-left. \tn 
% Row Count 22 (+ 11)
% Row 15
\SetRowColor{LightBackground}
\seqsplit{border-radius} & 5px & Bordure arrondie \tn 
% Row Count 25 (+ 3)
% Row 16
\SetRowColor{white}
\seqsplit{box-shadow} & 6px 6px 0px black (horizontale, verticale, & Ombre de boîte \tn 
% Row Count 28 (+ 3)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.748 cm} x{2.584 cm} x{3.268 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Propriétés des tableaux}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Propriété}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\seqsplit{border-collapse} & collapse, separate. & Fusion des bordures \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{empty-cells} & hide, show. & Affichage des cellules vides \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
\seqsplit{caption-side} & bottom, top. & Position du titre du tableau \tn 
% Row Count 8 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.596 cm} x{4.18 cm} x{1.824 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{8.4cm}}{\bf\textcolor{white}{Autres propriétés}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Propriété}} & {\bf{Valeurs (exemples)}} & {\bf{Description}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
cursor & crosshair, default, help, move, pointer, progress, text, wait, e-resize, ne-resize, auto, etc. & Curseur de souris \tn 
% Row Count 7 (+ 5)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{PHP Array Functions}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/array\_diff"\}\}array\_diff (arr1, arr2 ...)\{\{/popup\}\}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/array\_diff"\}\}array\_filter (arr, function)\{\{/popup\}\}} \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/array\_diff"\}\}array\_flip (arr)\{\{/popup\}\}} \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/array\_intersect"\}\}array\_intersect (arr1, arr2 ...)\{\{/popup\}\}} \tn 
% Row Count 8 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/array\_merge"\}\}array\_merge (arr1, arr2 ...)\{\{/popup\}\}} \tn 
% Row Count 10 (+ 2)
% Row 5
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/array\_pop"\}\}array\_pop (arr)\{\{/popup\}\}} \tn 
% Row Count 12 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/array\_push"\}\}array\_push (arr, var1, var2 ...)\{\{/popup\}\}} \tn 
% Row Count 14 (+ 2)
% Row 7
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/array\_reverse"\}\}array\_reverse (arr)\{\{/popup\}\}} \tn 
% Row Count 16 (+ 2)
% Row 8
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/array\_search"\}\}array\_search (needle, arr)\{\{/popup\}\}} \tn 
% Row Count 18 (+ 2)
% Row 9
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/array\_walk"\}\}array\_walk (arr, function)\{\{/popup\}\}} \tn 
% Row Count 20 (+ 2)
% Row 10
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/count"\}\}count (count)\{\{/popup\}\}} \tn 
% Row Count 22 (+ 2)
% Row 11
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/in\_array"\}\}in\_array (needle, haystack)\{\{/popup\}\}} \tn 
% Row Count 24 (+ 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}{PHP String Functions}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/crypt"\}\}crypt (str, salt)\{\{/popup\}\}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/explode"\}\}explode (sep, str)\{\{/popup\}\}} \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/implode"\}\}implode (glue, arr)\{\{/popup\}\}} \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/nl2br"\}\}nl2br (str)\{\{/popup\}\}} \tn 
% Row Count 8 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/sprintf"\}\}sprintf (frmt, args)\{\{/popup\}\}} \tn 
% Row Count 10 (+ 2)
% Row 5
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/strip\_tags"\}\}strip\_tags (str, allowed\_tags)\{\{/popup\}\}} \tn 
% Row Count 12 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/str\_replace"\}\}str\_replace (search, replace, str)\{\{/popup\}\}} \tn 
% Row Count 14 (+ 2)
% Row 7
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/strpos"\}\}strpos (str, needle)\{\{/popup\}\}} \tn 
% Row Count 16 (+ 2)
% Row 8
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/strrev"\}\}strrev (str)\{\{/popup\}\}} \tn 
% Row Count 18 (+ 2)
% Row 9
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/strstr"\}\}strstr (str, needle)\{\{/popup\}\}} \tn 
% Row Count 20 (+ 2)
% Row 10
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/strtolower"\}\}strtolower (str)\{\{/popup\}\}} \tn 
% Row Count 22 (+ 2)
% Row 11
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/strtoupper"\}\}strtoupper (str)\{\{/popup\}\}} \tn 
% Row Count 24 (+ 2)
% Row 12
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/substr"\}\}substr (string, start, len)\{\{/popup\}\}} \tn 
% Row Count 26 (+ 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}{PHP Regular Expressions Functions}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/ereg"\}\}ereg (pattern, str)\{\{/popup\}\}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/split"\}\}split (pattern, str)\{\{/popup\}\}} \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/ereg\_replace"\}\}ereg\_replace (pattern, replace, str)\{\{/popup\}\}} \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/preg\_grep"\}\}preg\_grep (pattern, arr)\{\{/popup\}\}} \tn 
% Row Count 8 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/preg\_match"\}\}preg\_match (pattern, str)\{\{/popup\}\}} \tn 
% Row Count 10 (+ 2)
% Row 5
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/preg\_match\_all"\}\}preg\_match\_all (pattern, str, arr)\{\{/popup\}\}} \tn 
% Row Count 12 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/preg\_replace"\}\}preg\_replace (pattern, replace, str)\{\{/popup\}\}} \tn 
% Row Count 14 (+ 2)
% Row 7
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/preg\_split"\}\}preg\_split (pattern, str)\{\{/popup\}\}} \tn 
% Row Count 16 (+ 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}{PHP Filesystem Functions}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/clearstatcache"\}\}clearstatcache ()\{\{/popup\}\}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/copy"\}\}copy (source, dest)\{\{/popup\}\}} \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/fclose"\}\}fclose (handle)\{\{/popup\}\}} \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/fgets"\}\}fgets (handle, len)\{\{/popup\}\}} \tn 
% Row Count 8 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/file"\}\}file (file)\{\{/popup\}\}} \tn 
% Row Count 10 (+ 2)
% Row 5
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/filemtime"\}\}filemtime (file)\{\{/popup\}\}} \tn 
% Row Count 12 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/filesize"\}\}filesize (file)\{\{/popup\}\}} \tn 
% Row Count 14 (+ 2)
% Row 7
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/file\_exists"\}\}file\_exists (file)\{\{/popup\}\}} \tn 
% Row Count 16 (+ 2)
% Row 8
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/fopen"\}\}fopen (file, mode)\{\{/popup\}\}} \tn 
% Row Count 18 (+ 2)
% Row 9
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/fread"\}\}fread (handle, len)\{\{/popup\}\}} \tn 
% Row Count 20 (+ 2)
% Row 10
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/fwrite"\}\}fwrite (handle, str)\{\{/popup\}\}} \tn 
% Row Count 22 (+ 2)
% Row 11
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/readfile"\}\}readfile (file)\{\{/popup\}\}} \tn 
% Row Count 24 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="Link"\}\}TEXT\{\{/popup\}\}}  \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}{PHP Date and Time Functions}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/checkdate"\}\}checkdate (month, day, year)\{\{/popup\}\}} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/date"\}\}date (format, timestamp)\{\{/popup\}\}} \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/getdate"\}\}getdate (timestamp)\{\{/popup\}\}} \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/mktime"\}\}mktime (hr, min, sec, month, day, yr)\{\{/popup\}\}} \tn 
% Row Count 8 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/strftime"\}\}strftime (formatstring, timestamp)\{\{/popup\}\}} \tn 
% Row Count 10 (+ 2)
% Row 5
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/strtotime"\}\}strtotime (str)\{\{/popup\}\}} \tn 
% Row Count 12 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\{\{popup="http://php.net/time"\}\}time ()\{\{/popup\}\}} \tn 
% Row Count 13 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{p{0.8 cm} x{7.2 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{PHP Date Formatting}}  \tn
% Row 0
\SetRowColor{LightBackground}
Y & 4 digit year (2008) \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
y & 2 digit year (08) \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
F & Long month (January) \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
M & Short month (Jan) \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
m & Month $^{\textrm{4}}$ (01 to 12) \tn 
% Row Count 5 (+ 1)
% Row 5
\SetRowColor{white}
n & Month (1 to 12) \tn 
% Row Count 6 (+ 1)
% Row 6
\SetRowColor{LightBackground}
D & Short day name (Mon) \tn 
% Row Count 7 (+ 1)
% Row 7
\SetRowColor{white}
l & Long day name (Monday) (lowercase L) \tn 
% Row Count 8 (+ 1)
% Row 8
\SetRowColor{LightBackground}
d & Day $^{\textrm{4}}$ (01 to 31) \tn 
% Row Count 9 (+ 1)
% Row 9
\SetRowColor{white}
j & Day (1 to 31) \tn 
% Row Count 10 (+ 1)
% Row 10
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{} \tn 
% Row Count 10 (+ 0)
% Row 11
\SetRowColor{white}
h & 12 Hour $^{\textrm{4}}$ (01 to 12) \tn 
% Row Count 11 (+ 1)
% Row 12
\SetRowColor{LightBackground}
g & 12 Hour (1 to 12) \tn 
% Row Count 12 (+ 1)
% Row 13
\SetRowColor{white}
H & 24 Hour $^{\textrm{4}}$ (00 to 23) \tn 
% Row Count 13 (+ 1)
% Row 14
\SetRowColor{LightBackground}
G & 24 Hour (0 to 23) \tn 
% Row Count 14 (+ 1)
% Row 15
\SetRowColor{white}
i & Minutes $^{\textrm{4}}$ (00 to 59) \tn 
% Row Count 15 (+ 1)
% Row 16
\SetRowColor{LightBackground}
s & Seconds $^{\textrm{4}}$ (00 to 59) \tn 
% Row Count 16 (+ 1)
% Row 17
\SetRowColor{white}
\mymulticolumn{2}{x{8.4cm}}{} \tn 
% Row Count 16 (+ 0)
% Row 18
\SetRowColor{LightBackground}
w & Day of week $^{\textrm{1}}$ (0 to 6) \tn 
% Row Count 17 (+ 1)
% Row 19
\SetRowColor{white}
z & Day of year (0 to 365) \tn 
% Row Count 18 (+ 1)
% Row 20
\SetRowColor{LightBackground}
W & Week of year $^{\textrm{2}}$ (1 to 53) \tn 
% Row Count 19 (+ 1)
% Row 21
\SetRowColor{white}
t & Days in month (28 to 31) \tn 
% Row Count 20 (+ 1)
% Row 22
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{} \tn 
% Row Count 20 (+ 0)
% Row 23
\SetRowColor{white}
a & am or pm \tn 
% Row Count 21 (+ 1)
% Row 24
\SetRowColor{LightBackground}
A & AM or PM \tn 
% Row Count 22 (+ 1)
% Row 25
\SetRowColor{white}
B & Swatch Internet Time (000 to 999) \tn 
% Row Count 23 (+ 1)
% Row 26
\SetRowColor{LightBackground}
S & Ordinal Suffix (st, nd, rd, th) \tn 
% Row Count 24 (+ 1)
% Row 27
\SetRowColor{white}
\mymulticolumn{2}{x{8.4cm}}{} \tn 
% Row Count 24 (+ 0)
% Row 28
\SetRowColor{LightBackground}
T & Timezone of machine (GMT) \tn 
% Row Count 25 (+ 1)
% Row 29
\SetRowColor{white}
Z & Timezone offset (seconds) \tn 
% Row Count 26 (+ 1)
% Row 30
\SetRowColor{LightBackground}
O & GMT offset (hours) (+0200) \tn 
% Row Count 27 (+ 1)
% Row 31
\SetRowColor{white}
I & Daylight saving (1 or 0) \tn 
% Row Count 28 (+ 1)
% Row 32
\SetRowColor{LightBackground}
L & Leap year (1 or 0) \tn 
% Row Count 29 (+ 1)
% Row 33
\SetRowColor{white}
\mymulticolumn{2}{x{8.4cm}}{} \tn 
% Row Count 29 (+ 0)
% Row 34
\SetRowColor{LightBackground}
U & Seconds since Epoch $^{\textrm{3}}$ \tn 
% Row Count 30 (+ 1)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{p{0.8 cm} x{7.2 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{PHP Date Formatting (cont)}}  \tn
% Row 35
\SetRowColor{LightBackground}
c & ISO 8601 (PHP 5) \seqsplit{(2008-07-31T18:30:13+01:00)} \tn 
% Row Count 2 (+ 2)
% Row 36
\SetRowColor{white}
r & RFC 2822 (Thu, 31 Jul 2008 18:30:13 +0100) \tn 
% Row Count 4 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{$^{\textrm{1}}$ 0 is Sunday, 6 is Saturday. \newline $^{\textrm{2}}$ Week that overlaps two years belongs to year that contains most days of that week. Hence week number for 1st January of a given year can be 53 if week belongs to previous year. date("W", mktime(0, 0, 0, 12, 8, \$year)) always gives correct number of weeks in \$year. \newline $^{\textrm{3}}$ The Epoch is the 1st January 1970. \newline $^{\textrm{4}}$ With leading zeroes}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{p{0.8 cm} x{7.2 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{PHP fopen() Modes}}  \tn
% Row 0
\SetRowColor{LightBackground}
r & Read \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
r+ & Read and write, prepend \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
w & Write, truncate \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
w+ & Read and write, truncate \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
a & Write, append \tn 
% Row Count 5 (+ 1)
% Row 5
\SetRowColor{white}
a+ & Read and write, append \tn 
% Row Count 6 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}


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

\end{document}