WEBVTT

00:00:00.633 --> 00:00:02.766
Vous savez ce que j'adore ?... Les listes.

00:00:02.766 --> 00:00:05.133
Avez-vous déjà fait une liste 
de courses ou de choses à faire ?

00:00:05.133 --> 00:00:07.342
Avez-vous déjà vu une liste 
sur une page Web,

00:00:07.342 --> 00:00:10.401
comme le "Top 10 des meilleurs
vidéos de la semaine" ?

00:00:10.401 --> 00:00:13.700
Je suis sûr que oui, car on 
rencontre des listes tout le temps.

00:00:13.700 --> 00:00:16.100
Le HTML nous propose des balises
pour faire des listes,

00:00:16.100 --> 00:00:18.966
et on va les utiliser pour afficher
la liste des raisons qui font

00:00:18.966 --> 00:00:23.963
que les lapins sont de bons
animaux de compagnie.

00:00:24.240 --> 00:00:26.813
Pour commencer une liste simple,

00:00:26.813 --> 00:00:30.102
on va utiliser la balise .

00:00:30.102 --> 00:00:32.433
A quoi correspond les 2 lettres "ul" ?

00:00:32.433 --> 00:00:35.460
J'imagine que le "l" est pour "liste".

00:00:35.460 --> 00:00:39.933
Le "u" correspond à "unordered"
en anglais (non ordonnée, sans ordre).

00:00:39.933 --> 00:00:42.800
Cela veut dire que le navigateur ne
va pas numéroter les éléments.

00:00:42.800 --> 00:00:45.066
Il va juste ajouter un point 
devant chaque élément.

00:00:45.066 --> 00:00:48.037
Pour voir ça, ajoutons 
le premier élément,

00:00:48.037 --> 00:00:50.200
on écrit : "Ils ont plein de poils".

00:00:50.200 --> 00:00:52.111
Vous voyez le cercle noir au début,
à gauche ?

00:00:52.111 --> 00:00:53.268
C'est un gros point.

00:00:53.268 --> 00:00:55.933
Bon. A quoi correspond la
balise  ?

00:00:55.933 --> 00:00:59.933
Le "l" est pour "liste" et le "i" 
pour "item" en anglais (élément).

00:00:59.933 --> 00:01:01.700
A chaque fois que nous ajoutons
un nouvel élément,

00:01:01.700 --> 00:01:05.633
on a besoin d'ajouter un  à
l'intérieur de .

00:01:05.633 --> 00:01:08.500
Chaque  doit au moins avoir 
un élément ,

00:01:08.500 --> 00:01:11.833
car une liste sans élément, 
ça ne sert à rien.

00:01:11.833 --> 00:01:13.733
OK. On va ajouter des éléments.

00:01:13.733 --> 00:01:17.366
On écrit : "Ils écoutent bien",

00:01:17.366 --> 00:01:21.535
"Ils mangent tous vos restes de carotte".

00:01:22.146 --> 00:01:24.933
OK. C'est pas mal pour une première liste.

00:01:24.933 --> 00:01:28.433
Tout le monde va vouloir un lapin
en lisant ça !

00:01:28.433 --> 00:01:30.000
Je n'ai pas numéroté cette liste car...

00:01:30.000 --> 00:01:33.417
il n'y a pas une raison plus importante
qu'une autre.

00:01:33.600 --> 00:01:36.666
Mais, parfois, on veut numéroter
(ordonner) la liste.

00:01:36.666 --> 00:01:44.083
Par exemple, si je veux afficher la liste :
Top 3 des lapins les plus célèbres.

00:01:44.186 --> 00:01:47.233
Donc, pour débuter notre liste ordonnée,

00:01:47.233 --> 00:01:51.166
on va utiliser la balise  au lieu de .

00:01:51.166 --> 00:01:54.633
Savez-vous pourquoi on utilise "ol" ?

00:01:54.633 --> 00:01:59.091
Utilisez les premières lettres de 
"liste ordonnée".

00:01:59.233 --> 00:02:02.633
Exactement ! "ol" correspond à
"liste ordonnée" !

00:02:02.633 --> 00:02:06.406
On indique au navigateur de numéroter
automatiquement chaque élément.

00:02:06.533 --> 00:02:09.500
On va continuer d'utiliser 
pour chaque élément

00:02:09.500 --> 00:02:11.733
à l'intérieur de la liste.

00:02:11.733 --> 00:02:13.400
On écrit : "Bugs Bunny",

00:02:13.400 --> 00:02:15.866
ensuite "Bambi",

00:02:15.866 --> 00:02:19.760
et, bien sûr, le "lapin de pâques".

00:02:20.068 --> 00:02:22.533
Ce qui est cool avec les listes ordonnées,

00:02:22.533 --> 00:02:25.033
c'est que le navigateur va les numéroter
lui-même tout seul.

00:02:25.033 --> 00:02:27.733
Donc, si on échange des éléments, 
si on en enlève ou si on en ajoute,

00:02:27.733 --> 00:02:30.400
il va continuer à les numéroter correctement.

00:02:30.400 --> 00:02:33.663
Par exemple, si vous me dites que
vous ne connaissez pas "Bambi",

00:02:33.800 --> 00:02:37.323
Bon. D'abord, je vais vous demander 
de regarder le film "Bambi" !

00:02:37.400 --> 00:02:41.110
Ensuite je me forcerais à déplacer
"Bambi" en bas de la liste.

00:02:41.233 --> 00:02:44.466
Et du coup, le pauvre "Bambi"
se retrouve numéro 3 !

00:02:44.466 --> 00:02:47.423
OK. Vous connaissez maintenant 
ce qu'il faut pour créer des listes.

00:02:47.423 --> 00:02:50.670
Continuez ! Et listez tout ce que vous voulez !